GitHub 博客园 Nanakon

【鼠标】位置

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <style type="text/css">
    #tip{ position:absolute; background:#ffc; color:#333; font:14px/1.5 arial;}
    </style>
    <div id="tip">
        <span id="tip-left"></span> | <span id="tip-top"></span>
    </div>
    
    <script>
    document.onmousemove = function (e) {        
        var posx = 0, posy = 0,
            e = e || window.event,
            get = function (id) {
                return document.getElementById(id);
            },
            tip = get('tip'), tipLeft = get('tip-left'), tipTop = get('tip-top');    
        if (e.pageX || e.pageY) {
            posx = e.pageX;
            posy = e.pageY;
        } else if (e.clientX || e.clientY) {
            posx = e.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
            posy = e.clientY + document.documentElement.scrollTop + document.body.scrollTop;
        };    
        tip.style.top = +posy + 15 + 'px';
        tip.style.left = +posx + 15 + 'px';    
        tipLeft.innerHTML = 'Left: ' + posx;
        tipTop.innerHTML = 'Top: ' + posy;        
    };
    </script>
</body>
</html>

posted on 2012-06-28 18:04  jzm17173  阅读(138)  评论(0)    收藏  举报

导航

轻音