在网页中拖动可移动层DIV，鼠标指针的样式问题？

本帖最后由 u013599350 于 2014-02-10 19:57:10 编辑

解决方案 »

  1.   

    在IE 火狐下，应该是没有问题的 Chrome 浏览器 下会存在你所描述的问题 阻止下默认事件document.onselectstart = function(){return false;};示例代码如下<!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style>
    .move{width:200px;height:200px;background:red;position:absolute;}
    </style>
    <script>
    window.onload=function()
    {
    var oDiv=document.getElementsByTagName('div')[0];
    document.onselectstart = function(){return false;};
    oDiv.onmousedown=function(ev)
    {
    var ev=ev||window.event;
    var iLeft=this.offsetLeft;
    var iTop=this.offsetTop;
    var mouseX=ev.clientX;
    var mouseY=ev.clientY;
    document.onmousemove=function(ev)
    {
    var ev=ev||window.event;
    oDiv.style.left=iLeft+ev.clientX-mouseX+'px';
    oDiv.style.top=iTop+ev.clientY-mouseY+'px';

    }
    document.onmouseup=function()
    {
    document.onmousemove=null;
    document.onmouseup=null;
    }

    }
    }
    </script>
    </head><body>
    <div class="move"></div>
    </body>
    </html>