ondragstart Event in JavaScript
ondragstart Event in JavaScript
The ondragstart event fires when the user starts to drag an element or text selection. Links are draggable by default similar to images. We can apply this attribute/event on all HTML elements. There are many event attributes that are used in drag and drop. These are:-
1. Events fired on the draggable target:-
- ondragstart event fired when the user starts to drag an element.
- ondrag event fired when an element is being dragged.
- ondragend event fired when the user has finished dragging the element.
2. Events fired on the drop target:-
- ondragenter event fired when the dragged element enters the drop target.
- ondragover event fired when the dragged element is over the drop target.
- ondragleave event fired when the dragged element leaves the drop target.
- ondrop event fired when the dragged element is dropped on the drop target.
Syntax:-
Its syntax is:- < anyElement ondragstart="my_script" > OR object.ondragstart= function(){my_script} OR object.addEventListener("dragstart", my_script)
Code Explanation
All Tutorials related to HTML DOM DragEvent Properties and Methods
ondrag Event in JavaScript
ondragend Event in JavaScript
ondragenter Event in JavaScript
ondragleave Event in JavaScript
ondragover Event in JavaScript
ondragstart Event in JavaScript
ondrop Event in JavaScript
All Sections related to JavaScript
JavaScript Intro
JavaScript Intro Quiz
JavaScript Intro Exercise
JavaScript Basic
JavaScript Basic Quiz
JavaScript Basic Exercise
JavaScript Advance
JavaScript Advance Quiz
JavaScript Advance Exercise
JavaScript ES6
JavaScript ES6 Quiz
JavaScript ES6 Exercise
JavaScript Array Methods and Properties
JavaScript String Methods and Properties
JavaScript Number Methods and Properties
JavaScript Math Properties and Methods
JavaScript Date Methods and Properties
JavaScript Global Methods and Properties
JavaScript RegExp Properties and Methods
JavaScript Class Methods and Keywords
JavaScript Errors, JSON and Booleans
JavaScript Statements
JavaScript Window History Object Properties and Methods
JavaScript Window Location Object Properties and Methods
JavaScript Window Screen Object Properties
JavaScript Window Navigator Object Properties and Methods
JavaScript Window Object Properties and Methods
JavaScript Console Object Methods
JavaScript Geolocation and Storage APIs
JavaScript CSSStyleDeclaration Object Methods and Properties
HTML DOM Documents Object Properties and Methods
DOM HTMLCollection Properties and Methods
HTML DOM Attributes Properties and Methods
HTML DOM Elements Properties and Methods
HTML DOM Style Object Properties
HTML DOM AnimationEvent Properties and Methods
HTML DOM ClipboardEvent Properties and Methods
HTML DOM DragEvent Properties and Methods
HTML DOM FocusEvent Properties and Methods
HTML DOM HashChangeEvent Properties and Methods
HTML DOM InputEvent Properties and Methods
HTML DOM KeyboardEvent Properties and Methods
HTML DOM MouseEvent Properties and Methods
HTML DOM PageTransitionEvent Properties and Methods
HTML DOM ProgressEvent Properties and Methods
HTML DOM StorageEvent Properties and Methods
HTML DOM TransitionEvent Properties and Methods
HTML DOM WheelEvent Properties and Methods
HTML DOM UiEvent Properties and Methods
HTML DOM TouchEvent Properties and Methods
The Event Object Properties and Methods
