js实现拖动层

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>javascript实现拖动层</title>
<style type="text/css">
#test{width:200px; height:200px; background=\‘#\‘"  cursor:move; position:absolute; left:100px; top:100px}
</style>
</head>
<body>
<div id="test"></div>
<script type="text/javascript">
var obj=document.getElementById("test");
var b;
obj.    b=true;
    var divLeft=parseFloat(window.getComputedStyle?window.getComputedStyle(obj,null).left:obj.currentStyle.left);
    var divTop=parseFloat(window.getComputedStyle?window.getComputedStyle(obj,null).top:obj.currentStyle.top);
    var e=e||event;
    var divX=e.clientX-divLeft;  //计算鼠标和div边框的距离
    var divY=e.clientY-divTop;
    document.        if(b){
            var e=e||event;  //兼容IE8及以下
            obj.style.left=e.clientX-divX+"px";
            obj.style.top=e.clientY-divY+"px";
            }
        }
    }
document.    b=false;
}
</script>
</body>
</html>


本文出自 “前端开发” 博客,请务必保留此出处http://maobin.blog.51cto.com/6335599/1359085

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。