亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

JS onmousemove鼠標(biāo)移動(dòng)坐標(biāo)接龍DIV效果實(shí)例

 更新時(shí)間:2013年12月16日 16:59:55   作者:  
這篇文章主要介紹了JS onmousemove鼠標(biāo)移動(dòng)坐標(biāo)接龍DIV效果實(shí)例,有需要的朋友可以參考一下

效果:

 

思路:

利用onmousemove事件,然后獲取鼠標(biāo)的坐標(biāo),之后把DIV挨個(gè)遍歷,最后把鼠標(biāo)的坐標(biāo)賦給DIV。

代碼:

復(fù)制代碼 代碼如下:

<head runat="server">
    <title></title>
    <style type="text/css">
        div
        {
            width: 20px;
            height: 20px;
            background: #00FFFF;
            position: absolute;
        }
    </style>
    <script type="text/javascript">
        document.onmousemove = function (ev) {
            var div = document.getElementsByTagName('div');

            var oEvent = ev || event;       //判斷兼容性
            var pos = GetMouse(oEvent);     //確定兼容性后,利用鼠標(biāo)移動(dòng)坐標(biāo)的函數(shù)來(lái)取得橫縱坐標(biāo)
            for (var i = div.length - 1; i > 0; i--) {      //遍歷DIV,從最后一個(gè)開始。
                div[i].style.left = div[i - 1].offsetLeft + 'px';       //將前一個(gè)的offsetLeft給后一個(gè)
                div[i].style.top = div[i - 1].offsetTop + 'px';     //將前一個(gè)的offsetTop給后一個(gè)
            }
            div[0].style.left = pos.x + 'px';       //將鼠標(biāo)的橫坐標(biāo)給第一個(gè)
            div[0].style.top = pos.y + 'px';        //將鼠標(biāo)的縱坐標(biāo)給第一個(gè)
        }
        function GetMouse(ev) {     //獲取鼠標(biāo)移動(dòng)的坐標(biāo)
            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
            var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
            return { x: ev.clientX + scrollLeft, y: ev.clientY + scrollTop }
        }
    </script>
</head>
<body>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
    <div>
    </div>
</body>

相關(guān)文章

最新評(píng)論