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>
  • 相关阅读:
    django_开发报错
    SpringBoot 前后端数据参数交互
    消息队列学习笔记(一)
    2021年调用工商二维码退款查询接口
    2021年调用工商二维码退款接口
    2021年调用工商二维码生成接口及回调接口demo
    调用工商生成二维码接口文档的坑
    使用hutool工具类转换时间
    微信模板消息推送
    pom文件 spring-boot-maven-plugin 爆红
  • 原文地址:https://www.cnblogs.com/lujieting/p/10055193.html
Copyright © 2011-2022 走看看