JavaScript event兼容问题及ev.clientX左距离,ev.clientY上距离,及onmousemove移动事件

最新推荐文章于 2022-10-17 10:30:00 发布

戴宇琪

最新推荐文章于 2022-10-17 10:30:00 发布

阅读量1.1k

点赞数

分类专栏： WEB前端开发

本文链接：https://blog.csdn.net/yuqidai/article/details/51612602

版权

WEB前端开发专栏收录该内容

48 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript event兼容问题及ev.clientX左距离,ev.clientY上距离,及onmousemove移动事件</title>
<style>
#div1 {
    width:100px; height:100px; background-color:#72C39C; position:absolute
    }
</style>
<script>
window.onload = function(){
    var oDiv = document.getElementById('div1');
    document.onmousemove = function(ev){
        //event兼容性问题
        var ev = ev || event;
        //scrollTop兼容性处理
        var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
        
        oDiv.style.left = ev.clientX + 'px';
        oDiv.style.top = ev.clientY + scrollTop + 'px';
        
        //alert(ev.clientY);
        }
    }
</script>
</head>
<body>
    <div id="div1"></div>
</body>
</html>