在web中当鼠标拖动时如何让一张图片跟着被拖动？

在.net中用JS可以实现:
<HTML><HEAD>
<TITLE>图片</TITLE>
<SCRIPT language=JavaScript>
<!--
drag = 0
move = 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>
</HEAD><BODY onload=init()>
<span style="cursor:move">
<div id=block1 onmouseover="dragObj=block1; drag=1;" style="LEFT: 10px; WIDTH: 0px; POSITION:absolute; TOP: 60px; HEIGHT: 0px" onmouseout=drag=0>
<IMG alt="精彩图片" src="http://www.pconline.com.cn/images/newlogo1.gif">
</div>
</span></BODY>
</HTML>

解决方案 »

  1.   

    <script language="JavaScript">
    var newtop=0
    var newleft=0
    if (navigator.appName == "Netscape") {
    layerStyleRef="layer.";
    layerRef="document.layers";
    styleSwitch="";
    }
    else
    {
    layerStyleRef="layer.style.";
    layerRef="document.all";
    styleSwitch=".style";
    } function doMouseMove() { layerName = 'iit' eval('var curElement='+layerRef+'["'+layerName+'"]')
    eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="hidden"')
    eval('curElement'+styleSwitch+'.visibility="visible"')
    eval('newleft=document.body.clientWidth-curElement'+styleSwitch+'.pixelWidth')
    eval('newtop=document.body.clientHeight-curElement'+styleSwitch+'.pixelHeight')
    eval('height=curElement'+styleSwitch+'.height')
    eval('width=curElement'+styleSwitch+'.width')
    width=parseInt(width)
    height=parseInt(height)
    if (event.clientX > (document.body.clientWidth - 5 - width))
    {
    newleft=document.body.clientWidth + document.body.scrollLeft - 5 - width
    }
    else
    {
    newleft=document.body.scrollLeft + event.clientX
    }
    eval('curElement'+styleSwitch+'.pixelLeft=newleft') if (event.clientY > (document.body.clientHeight - 5 - height))
    {
    newtop=document.body.clientHeight + document.body.scrollTop - 5 - height
    }
    else
    {
    newtop=document.body.scrollTop + event.clientY
    }
    eval('curElement'+styleSwitch+'.pixelTop=newtop')
    } document.onmousemove = doMouseMove;</script>
    <script language="javascript">
    if (navigator.appName == "Netscape") { }
    else
    {
    document.write('<div ID=OuterDiv>')
    document.write('<img ID=iit src="" STYLE="position:absolute;TOP:0pt;LEFT:0pt;Z-INDEX:2;visibility:hidden;">')
    document.write('</div>')
    }
    </script>
    你到这里来看看 还有满多好的东西 
    http://js.wanxu.com/