zoukankan      html  css  js  c++  java
  • 鼠标跟着键盘飞=====兼容代码

    <style>
    img{
    position: absolute;
    }
    </style>
    </head>
    <body>
    <img src="imgs/tianshi.gif" alt="" id="im">
    <script src="../DOM/commer.js"></script>
    <script>
    // document.onmousemove=function (e) { //IE8支持:window.event
    // ver("im").style.left=e.clientX+"px";
    // ver("im").style.top=e.clientY+"px";
    // };

    //兼容代码
    //把代码放在一个对象中
    var evt={
    //window.event和事件参数对象e的兼容
    getEvent:function (evt) {
    return window.event||evt;
    },
    //可视区域横坐标的兼容代码
    getClientX:function (evt) {
    return this.getEvent(evt).clientX;
    },
    //可视区域纵坐标的兼容代码
    getClientY:function (evt) {
    return this.getEvent(evt).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;
    },

    //相对于页面的横坐标(pageX或者是clientX+scrollLeft)
    getPageX:function (evt) {
    return this.getEvent(evt).pageX?this.getEvent(evt).pageX:this.getClientX(evt)+this.getScrollLeft();
    },
    //相对于页面的纵坐标(pageY或者是clientY+scrollTop)
    getPageY:function (evt) {
    return this.getEvent(evt).pageY?this.getEvent(evt).pageY:this.getClientY(evt)+this.getScrollTop();
    }
    };


    //测试===================================================================
    document.onmousemove=function (e) { //IE8支持:window.event
    ver("im").style.left=evt.getPageX(e)+"px";
    ver("im").style.top=evt.getPageY(e)+"px";
    };
    </script>
  • 相关阅读:
    Sencha Touch 使用笔记
    区数据
    省市 数据
    js校验身份证
    js 邮政编码验证
    原生js添加class
    让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法
    js学习笔记 Function类型属性的理解
    js学习笔记 理解原型对象
    js学习笔记 chapter5 引用类型
  • 原文地址:https://www.cnblogs.com/lujieting/p/10055193.html
Copyright © 2011-2022 走看看