小代码 html 移动div 图片 文字 任意性_html/css_WEB-ITnose
- WBOY原創
- 2016-06-24 11:16:45891瀏覽
<Html><Head><title>能用鼠标拖放的图片</title></Head><Body bgColor="#ffffff" onload="init()"> <SCRIPT language=JavaScript>drag = 0move = 0function init() { window.document.onmousemove = mouseMove window.document.onmousedown = mouseDown window.document.onmouseup = mouseUp window.document.ondragstart = mouseStop}function mouseDown() { if (drag) { clickleft = window.event.x - parseInt(dragObj.style.left) clicktop = window.event.y - parseInt(dragObj.style.top) dragObj.style.zIndex += 1 move = 1 }}function mouseStop() { window.event.returnValue = false}function mouseMove() { if (move) { dragObj.style.left = window.event.x - clickleft dragObj.style.top = window.event.y - clicktop }}function mouseUp() { move = 0}</SCRIPT><DIV onmouseout=drag=0 onmouseover="dragObj=this; drag=1;" style="HEIGHT: 90px; LEFT: 200px; POSITION: absolute; TOP: 50px; WIDTH: 90px;background-color:red"></div><DIV onmouseout=drag=0 onmouseover="dragObj=this; drag=1;" style="HEIGHT: 90px; LEFT: 200px; POSITION: absolute; TOP: 170px; WIDTH: 90px;background-color:orange"></div><DIV onmouseout=drag=0 onmouseover="dragObj=this; drag=1;" style="HEIGHT: 90px; LEFT: 200px; POSITION: absolute; TOP: 290px; WIDTH: 90px;background-color:blue"></div></Body></Html>
当我们 加载图片在div上面的时候 作用就好看见了
有一定使用意义
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn