Drag events - Basic JavaScript Fast (66) | draggable, dataTransfer
Mouse dragging can be elaborated by means of its details. The video describes the dragstart, drag and dragend events. Then it discusses another group of drag events: dragenter, dragleave, dragover and drop.
If the DOM element is not draggable by default, we have to set the "draggable" attribute to "true" on the HTML file first.
During dragging, DOM elements can be moved with the help of the dataTransfer property. This property is the place to store the element being dragged. The dataTransfer property has two commonly used methods: getData and setData. They help us to achieve the process of data transfer during dragging.
1:14 - draggable attribute
3:40 - dragstart, drag, dragend
6:52 - dragenter, dragleave, dragover, drop
15:09 - dataTransfer property, setData and getData methods
Playlist of my JavaScript course
• [20 hours] JavaScript tutorial for be...
Playlist of my HTML5 and CSS3 tutorials
• [12 hours] HTML and CSS tutorials for...
Playlist of my algorithm walkthrough
• Algorithms and data structures | DSA ...
Playlist of my Java course
• [14 hours] Java tutorial for beginner...
Playlist of my Java examples
• Java projects for beginners | Java pr...
#javascripttutorial #javascriptfullcourse #begincodingfast #javascript #draganddrop