javascript - Many draggable images freely in the screen -
i'm trying build page me , team can position images freely on screen. problem can't figure out way make images draggable. tried figure out myself , came upon nice topic it: html5 drag , drop move div anywhere on screen?
i've tried apply idea page , replace "getelementsbyid" "getelementsbyclassname" no dice.
in addition, twice nice if draggable image respect responsiveness of page, if knows how that.
here codepen attempt: http://codepen.io/guiharrison/pen/eshyr
thanks!
well, made up, it's kinda buggy, can play around it.
<html> <head> <style> #mydiv{ width: 100px; height: 100px; border: solid black 1px; position: absolute; } </style> </head> <body> <div id="mydiv" onmousedown="ismousedown(1)" onmouseup="ismousedown(0)" onmousemove="mousemove(event)"></div> <script> var mousedown = false; function ismousedown(tf){ if(tf == 1){ mousedown = true; } else{ mousedown = false; } } function mousemove(event){ if(mousedown){ document.getelementbyid("mydiv").style.left=event.pagex; document.getelementbyid("mydiv").style.top=event.pagey; } } </script> </body>
Comments
Post a Comment