HTML5 drag and drop elements anywhere on the screen

Drag and drop does not move the element, if you want the element to move on drop you have to set the element’s new position in the drop event. I made an example that works for Firefox and Chrome, here are the gist:

 function drag_start ( event ) { var style = window.getComputedStyle( event .target, null ); event .dataTransfer.setData( "text/plain" , (parseInt(style.getPropertyValue( "left" ), 10 ) - event .clientX) + ',' + (parseInt(style.getPropertyValue( "top" ), 10

…

The post HTML5 Drag and Drop Elements Anywhere on the Screen first appeared on Lenix Blog .

This article is reprinted from https://blog.p2hp.com/archives/9791
This site is for inclusion only, and the copyright belongs to the original author.