<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>Document</title>

  <style>

    body {

      height: 1000px;

    }

  </style>

</head>

<body>

  <script src="common.js"></script>

  <script>

    // e.clientX/e.clientY   鼠标在可视区域中的位置

    //

    // e.pageX/e.pageY       鼠标在页面中的位置 有兼容性问题  从IE9以后才支持

    // pageY = clientY + 页面滚动出去的距离

    document.onclick = function (e) {

      e = e || window.event;

      console.log(getPage(e).pageX);

      console.log(getPage(e).pageY);

    }

    // 获取鼠标在页面的位置，处理浏览器兼容性

    function getPage(e) {

      var pageX = e.pageX || e.clientX + getScroll().scrollLeft;

      var pageY = e.pageY || e.clientY + getScroll().scrollTop;

      return {

        pageX: pageX,

        pageY: pageY

      }

    }

  </script>

</body>

</html>

pageX的兼容性处理2的更多相关文章

  1. pageX的兼容性处理1

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. javascript中一些常见的兼容性问题

    下面是一些Javascript的IE和Firefox(火狐)兼容性的常用例子 1. document.formName.item("itemName") 问题 说明:IE下,可以使 ...

  3. 在ie与火狐的兼容性

    1.在火狐下  document.getElementById("id").textContent可以获取当前获取id下的内容   而在ie下则为:document.getElem ...

  4. js在IE和FF下的兼容性问题

    本文出自前端档案,以作学习参考之用.自己也补充了一些内容 长久以来JavaScript兼容性一直是Web开发者的一个主要问题.在正式规范.事实标准以及各种实现之间的存在的差异让许多开发者日夜煎熬.为此 ...

  5. Javascript事件机制兼容性解决方案

    本文的解决方案可以用于Javascript native对象和宿主对象(dom元素),通过以下的方式来绑定和触发事件: 或者 var input = document.getElementsByTag ...

  6. IE 和Firefox的js兼容性总结

    IE 和Firefox的js兼容性总结 12 August 2010 11:39 Thursday by 小屋 标签: 浏览器 方法 属性 IT 写法 一.函数和方法差异 1 . getYear()方 ...

  7. js兼容性记录

    做BS开发就难免会用到javascript,而每个浏览器对javascript的支持有不同.这就需要我们程序员去兼容他们,不然有些浏览器就无法运行我们的代码.就会造来客户的投诉,如果让BoSS知道了, ...

  8. css兼容性的问题

    https://www.douban.com/note/314793848/ 随意的一个博客ie6的兼容 这个博客比较好 http://blog.csdn.net/chuyuqing/article/ ...

  9. IE和Firefox的Javascript兼容性总结

    长久以来JavaScript兼容性一直是Web开发者的一个主要问题.在正式规范.事实标准以及各种实现之间的存在的差异让许多开发者日夜煎熬.为此,主要从以下几方面差异总结IE和Firefox的Javas ...

随机推荐

  1. Git创建本地仓库

    使用Git创建本地仓库, 可以记录文本文件变化, 这里以自己的文章为例, 利用TortoiseGit工具创建一个本地Git仓库. 1. 切换到需要创建仓库的目录下, 比如:D:\MyDoc\Devel ...

  2. 初识python：tkinter 实现 弹球小游戏(面向对象)

    使用蹩脚式面相对象,实现弹球小游戏(非面向对象实现,主要介绍tk基础用法). #!/user/bin env python # author:Simple-Sir # time:2020/8/7 10 ...

  3. [vscode] os.getcwd()，调试和命令行运行的结果不一致

    问题描述: 调试和命令行运行的时候工作目录不一致 这会导致一个问题,我想从上级目录导入模块的话,F5调试就会找不到模块,而命令行则没问题 那么我该如何调试呢? 目录结构: top  └ folder_ ...

  4. spring boot 解决 跨域 的两种方法 -- 前后端分离

    1.前言 以前做项目 ,基本上是使用 MVC 模式 ,使得视图与模型绑定 ,前后端地址与端口都一样 , 但是现在有些需求 ,需要暴露给外网访问 ,那么这就出现了个跨域问题 ,与同源原则冲突, 造成访问 ...

  5. SpringMVC拦截器的应用

    一.作用 好文章参考:https://www.cnblogs.com/panxuejun/p/7715917.html 对请求进行预处理和后处理: 使用场景: 登录验证,判断用户是否登录 权限验证,判 ...

  6. 下载并搭建maven环境

    1.下载maven 1.在官网下载maven  http://maven.apache.org/download.cgi 2.将下载maven解压.复制路径. 2.搭建maven环境 1.新建M2_H ...

  7. 应用层：http请求报文和响应报文

    1.http请求报文 请求报文由请求行.报文头.空行.报文体组成. 请求行可分为请求方法.请求URL.HTTP协议及版本. 举例1: GET / HTTP/1.1\nHost: 220.181.38. ...

  8. python极简教程05：生成器和匿名函数

    测试奇谭,BUG不见. 讲解之前,我先说说我的教程和网上其他教程的区别: 1 我分享的是我在工作中高频使用的场景,是精华内容: 2 我分享的是学习方法,亦或说,是指明你该学哪些.该重点掌握哪些内容: ...

  9. Python垃圾回收和Linux Fork

    前言 在口袋助理看到了其他部门的同事针对Python2内存占用做的一点优化工作,自己比较感兴趣,遂记录下. Linux fork简介 fork是Linux提供的创建子进程的系统调用.为了优化创建进程速 ...

  10. 关于CKCsec安全研究院

    关于CKCsec安全研究院 CKCsec安全研究院所有文档开源于语雀,会源源不断更新. 部分内容 微信公众号 知识星球 使用需知 由于传播.利用此文所提供的信息而造成的任何直接或者间接的后果及损失,均 ...