Where can we drag elements to is another point we need to clarify.
As well as we can’t just drag any element, we can’t also just drop into any element. The element must be valid drop target.
To make an element a drop target you listen for its dragover event and you either return false from it, or you call preventDefault() on the event passed:
const element = document.querySelector('#my-drop-target)
element.addEventListener('dragover', event => {
event.preventDefault()
})
Once we do so, we have a draggable element and a drop target, and we can start looking into events.
Lessons in this unit:
| 0: | Introduction |
| 1: | ▶︎ Drop targets |
| 2: | Drag events |
| 3: | Dragging data |
| 4: | Set / get the effect |
| 5: | The data being transferred |
Are you intimidated by Git? Can’t figure out
merge vs rebase? Are you afraid of screwing up
something any time you have to do something in
Git? Do you rely on ChatGPT or random people’s
answer on StackOverflow to fix your problems?
Your coworkers are tired of explaining Git to
you all the time? Git is something we all need
to use, but few of us really master it. I
created this course to improve your Git (and
GitHub) knowledge at a radical level. Launching
May 21, 2024. Join the waiting list!