event对象（获取鼠标位置）

最新推荐文章于 2024-01-17 09:56:51 发布

梁什么鸭，

最新推荐文章于 2024-01-17 09:56:51 发布

阅读量790

点赞数

分类专栏： Javascript 文章标签： javascript

本文链接：https://blog.csdn.net/Lm_choose_live/article/details/116564447

版权

Javascript 专栏收录该内容

74 篇文章 2 订阅

订阅专栏

event对象：用来获取事件的详细信息：鼠标位置、键盘按键

火狐、低版本的chrome不兼容

解决：var oEvent = ev || event;

举个栗子1：不管鼠标点击哪里，都会有反应

你可能会想到直接给body设置点击事件，运行后发现没反应

原因： body的height是由里面的内容撑开的，当里面为空时，body高度为0，此时点击页面自然没反应。

解决：给document设置点击事件，document代表的是整个网页

这里做个延伸:
document 的childNodes[0] 是 “！（<!DOCTYPE html>）”
childNodes[1] 是 html

获取鼠标位置

<script>
    function getPos(e) {
      var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
      var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;

      return {x: e.clientX+scrollLeft, y: e.clientY+scrollTop};
    }  //加上滚动条的高度和宽度

    window.onload = function () {
      var aDiv = document.getElementsByTagName('div');

      document.onmousemove = function (e) {
        var e = e || event;
        var pos = getPos(e);
        for (var i=aDiv.length-1; i>0; i--) {
          aDiv[i].style.left = aDiv[i-1].offsetLeft + 'px';
          aDiv[i].style.top = aDiv[i-1].offsetTop + 'px';
        }  //使一个物体的位置跟前一个物体的位置移动

        aDiv[0].style.left = pos.x + 'px';
        aDiv[0].style.top = pos.y + 'px';
      };
    };
  </script>

梁什么鸭，

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
event对象（获取鼠标位置）

event对象：用来获取事件的详细信息：鼠标位置、键盘按键火狐、低版本的chrome不兼容解决：var oEvent = ev || event;举个栗子1：不管鼠标点击哪里，都会有反应你可能会想到直接给body设置点击事件，运行后发现没反应原因： body的height是由里面的内容撑开的，当里面为空时，body高度为0，此时点击页面自然没反应。解决：给document设置点击事件，document代表的是整个网页这里做个延伸: document 的child...
复制链接

扫一扫