小代码 html 移动div 图片 文字 任意性_html/css_WEB-ITnose
- WBOY원래의
- 2016-06-24 11:16:45892검색
<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으로 문의하세요.