<!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. gojs 如何实现虚线(蚂蚁线)动画？

    在绘制 dag 图时,通过节点和来箭头的连线来表示节点彼此之间的关系.而节点常常又带有状态,为了更好的表示节点之间的流程关系,loading 状态的节点,与后续节点之间,需要用 动画着的虚线 表示,表 ...

  2. 云南农职 - 互联网技术学院 - 美和易思大一SCME JAVA高级结业考试机试试题

    目录 一.语言和环境 二.实现功能 1.文件复制功能(IO) 2.消息接受站建设 三.评分标准 四.实现代码 一.语言和环境 实现语言:Java. 开发工具:eclipse. 使用技术:IO流+网络编 ...

  3. 编写Java程序，应用客户端和服务端通过 Eclipse 控制台的输入和显示实现简易的聊天功能

    查看本章节 查看作业目录 需求说明: 应用客户端和服务端通过 Eclipse 控制台的输入和显示实现简易的聊天功能 实现思路: 创建 Java 项目,在项目中创建服务端类 ChatServerThre ...

  4. Python升级至2.7方法

    在Linux下Python升级至2.7的详细步骤方法, 此处的升级,使用的是全新安装新版本,替换旧版本的方法, 同时新旧版本可以共存,将默认python指向最新2.7版本即可. 1.下载Python- ...

  5. JDK线程池异常处理方式

    1. 抛出异常 execute() java.util.concurrent.ThreadPoolExecutor#runWorker 中抛出,抛出之后经过以下两个步骤: catch块捕获,捕获之后再 ...

  6. linux分区（挂载）

    主分区: 最多4个扩展分区: 最多一个: 扩展分区+主分区最多4个: 不能存放数据,只能划分逻辑分区逻辑分区: 可格式化.存放数据: 分区编号只能从5开始(1.2.3.4编号为主分区或扩展分区) 所有 ...

  7. 初识python： xml 操作

    导入模块: import xml.etree.ElementTree as ET 创建xml文件: new_xml = ET.Element("namelist") # 创建根节点 ...

  8. [ css ] 实现漂亮的输入框动画（借鉴自panjiachen的后台管理项目）

    效果预览 HTML <div class="l-custom-input"> <input size="large" id="l-i ...

  9. spring boot 启动警告 WARN 15684 --- [ restartedMain] c.n.c.sources.URLConfigurationSource : No URLs will be polled as dynamic configuration sources. 解决

    添加一个配置文件config.properties ,即便是空的也是可以的

  10. 微信小程序css继承

    在微信小程序里写的全局样式,pages里的组件是可以继承的,但是components里只能继承font和color属性.