ITPub博客

首页 > 应用开发 > > 图片不能随着鼠标在页面随意移动

图片不能随着鼠标在页面随意移动

作者:netroop 时间:2019-07-29 09:55:15 0 删除 编辑
* {
    margin: 0;
    padding: 0;
  }
img {
    position: absolute;
  }
<img src="../images/cangjingkong.jpg" alt="" id="img"/>
function my$(id) {
        return document.getElementById(id);
    }
 
var evt = {
        getEvent: function (event) {
            return window.event | event;
        },
        getClientX: function (event) {
            return this.getEvent(event).clientX;
        },
        getClientY: function (event) {
            return this.getEvent(event).clientY;
        },
        getScrollLeft: function () {
            return window.pageXOffset || document.body.scrollLeft || document.documentElement.scrollLeft || 0;
        },
        getScrollTop: function () {
            return window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop || 0;
        },
        getPageX: function (event) {
            return this.getEvent(event).pageX ? this.getEvent(event).pageX : this.getClientX(event) + this.getScrollLeft();
        },
        getPageY: function (event) {
            return this.getEvent(event).pageY ? this.getEvent(event).pageY : this.getClientY(event) + this.getScrollTop();
        }
    };
document.onmousemove = function (e) {
            my$("img").style.left=evt.getPageX(e)+"px";
            my$("img").style.top=evt.getPageY(e)+"px";
    }

一段window.event和e的兼容代码,还有page的兼容代码,然后图片飘不起来,谷歌里面console也没有报错,请教各位大神指点一下,哪里出错了?

来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/4741/viewspace-3162902/ ,如需转载,请注明出处,否则将追究法律责任。

请登录后发表评论 登录
全部评论

注册时间:2019-04-25

  • 博文量
    152
  • 访问量
    1068