CODEWITHSUNDEEP
javascripthtmldrag-and-drop
callum
callum

Reputation: 37769

How to constrain movement when using HTML5 native drag and drop?

Various JavaScript libraries, such as jQuery UI, offer drag-and-drop interactions where you can constrain the movement of the dragged element to a single axis, or within a particular area.

Is this sort of thing possible using the native HTML5 drag and drop API?

Upvotes: 22

Views: 10925

Answers (1)

Jordan
Jordan

Reputation: 3996

It's totally different! The jQuery UI drag and drop make element move (with top and left CSS properties) in the page.

The native HTML5 drag and drop API only allow you to move a "ghost" of the draggable element (of course, you can hide the original element while dragging the ghost).

The API come with a lot of event but no, you can't constrain mouse position so you can't constrain to a single axis (cause the ghost follow the mouse position, even if the mouse leave the page (but event may probably stop operate)).

Upvotes: 12

Related Questions