求DIV移动代码,以兼容FF,

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> New Document </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<meta name="Design Corp" content="myhhe.cn" />
<meta name="Designer" content="hayden" />
<meta name="Designer mail" content="[email protected]" />
<meta name="robots" content="hayden" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<script language="JavaScript" type="text/javascript">
var drag_=false
var D=new Function('obj','return document.getElementById(obj);')
var oevent=new Function('e','if (!e) e = window.event;return e')
function Move_obj(obj){
var x,y;
D(obj).onmousedown=function(e){
drag_=true;
with(this){
style.position="absolute";var temp1=offsetLeft;var temp2=offsetTop;
x=oevent(e).clientX;y=oevent(e).clientY;
document.onmousemove=function(e){
if(!drag_)return false;
with(this){
style.left=temp1+oevent(e).clientX-x+"px";
style.top=temp2+oevent(e).clientY-y+"px";
}
}
}
document.onmouseup=new Function("drag_=false");
}
}
</script>
<body>
<div id="test" style="background-color:#0099CC;width:200px;height:100px;border:1px #000 solid;" onmouseover='Move_obj("test")'>鼠标过来点击拖动层</div>
</body>
</html>

解决方案 »

  1.   

    <style type="text/css">
        #img1{
         border:1px green solid;
         position:absolute;
         left:2px;
         top:43px;
         width:147px;
         height:90px;
         z-index:100;
         visibility: visible;
        }</style>
    <div id="img1">
        <img src="http://gjp.kancai.com/images/gjp.bmp" alt="" /></div>
    <script>
    var xPos = 300;
    var yPos = 200; 
    var step = 1;
    var delay = 20; 
    var height = 0;
    var Hoffset = 0;
    var Woffset = 0;
    var yon = 0;
    var xon = 0;
    var pause = true;
    var interval;
    img1.style.top = yPos;
    function changePos() 
    {
    width = document.body.clientWidth;
    height = document.body.clientHeight;
    Hoffset = img1.offsetHeight;
    Woffset = img1.offsetWidth;
    img1.style.left = xPos + document.body.scrollLeft;
    img1.style.top = yPos + document.body.scrollTop;
    if (yon) 
    {yPos = yPos + step;}
    else 
    {yPos = yPos - step;}
    if (yPos < 0) 
    {yon = 1;yPos = 0;}
    if (yPos >= (height - Hoffset)) 
    {yon = 0;yPos = (height - Hoffset);}
    if (xon) 
    {xPos = xPos + step;}
    else 
    {xPos = xPos - step;}
    if (xPos < 0) 
    {xon = 1;xPos = 0;}
    if (xPos >= (width - Woffset)) 
    {xon = 0;xPos = (width - Woffset);   }
    }

    function start()
     {
      img1.visibility = "visible";
    interval = setInterval('changePos()', delay);
    }
    function pause_resume() 
    {
    if(pause) 
    {
    clearInterval(interval);
    pause = false;}
    else 
    {
    interval = setInterval('changePos()',delay);
    pause = true; 
    }
    }
    start();
    </script>
      

  2.   

    http://gi.2288.org/test/sqJsTools/tools/DragBox/DragBox2-1/Demo/General.html
    http://gi.2288.org/test/sqJsTools/tools/DragAndDrop/DragAndDrop1/Demo/General.html