DTD未声明:document.body.scrollTop

DTD已声明:document.documentElement.scrollTop

火狐谷歌IE9:window.pageYOffset

compatMode:可以判断是否声明DTD,CSS1Compat是,BackCompat否

复杂版本:

<script>
window.onscroll = function () {
console.log(scroll().left + " " + scroll().top);
} function scroll() {
if (window.pageYOffset) {
return {
"top": window.pageYOffset,
"left": window.pageXOffset
};
} else if (document.compatMode == "CSS1Compat") {
return {
"top": document.documentElement.scrollTop,
"left": document.documentElement.scrollLeft
};
} else {
return {
"top": document.body.scrollTop,
"left": document.body.scrollLeft
};
}
}
</script>

简单版本:

<script>
window.onscroll = function () {
console.log(scroll().left + " " + scroll().top);
} function scroll() {
return {
"top": window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop,
"left": window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft
};
}
</script>

JS——scroll封装的更多相关文章

  1. JS 对象封装的常用方式

    JS是一门面向对象语言,其对象是用prototype属性来模拟的,下面,来看看如何封装JS对象. 常规封装 function Person (name,age,sex){ this.name = na ...

  2. js类封装

    将js方法封装成类,好处就是团队开发中避免命名冲突,部分类整理代码如下: function LocalStorageHelper() { //检测浏览器是否支持localStorage this.ch ...

  3. 【Node.js 自己封装的库 http_parse, libuv】

    [Node.js 自己封装的库 http_parse, libuv] Node.js 介绍:一个网络框架,更多:http://www.oschina.net/p/nodejs 官网:http://no ...

  4. main.js中封装全局登录函数

    1. 在 main.js 中封装全局登录函数 通过 vue 对象的原型扩展,可以扩展一个函数,这样这个函数就可以在每一个界面通过类似指向对象的方式,去访问这个函数. 如下是 main.js 扩展的函数 ...

  5. Node.js模块封装及使用

    Node.js中也有一些功能的封装,类似C#的类库,封装成模块这样方便使用,安装之后用require()就能引入调用. 一.Node.js模块封装 1.创建一个名为censorify的文件夹 2.在c ...

  6. 基于js原生封装的点击显示完整文字

    基于js原生封装的点击显示完整文字 (function(window) { var inner = ''; var showCont_s = function(ele) { this.init.app ...

  7. react request.js 函数封装

    1.request.js  函数封装 import { Toast } from 'antd-mobile'; import axios from 'axios'; import store from ...

  8. 使用jq把js代码封装一个自己的插件

    为什么要把js功能封装成插件呢?我觉得有以下几点吧 1.最基本的原因就是便于代码复用. 2.便于维护和管理. 3.提升自身的能力. 4.避免各个相同功能组件的干扰,以及一些作用域会相互影响的问题. j ...

  9. 常用js方法封装

    常用js方法封装 var myJs = { /* * 格式化日期 * @param dt 日期对象 * @returns {string} 返回值是格式化的字符串日期 */ getDates: fun ...

随机推荐

  1. [poj2425]A Chess Game_博弈论

    A Chess Game poj-2425 题目大意:题目链接 注释:略. 想法:这个题就是为什么必须要用记忆化搜索.因为压根就不知道后继是谁. 我们通过SG定理可知:当前游戏的SG值等于所有子游戏的 ...

  2. MAPZONE GIS SDK接入Openlayers3之一——矢量数据集接入

    在选择开源前端GIS框架的时候,定下来MapBox和Openlayers3.起初被MapBox美观的地图显示效果所吸引,研究后发现其实现机制与MAPZONE GIS SDK相差深远,不如Openlay ...

  3. LeetCode 917. Reverse Only Letters (仅仅反转字母)

    题目标签:String 利用left, right 两个pointers, 从左右开始 互换 字母.如果遇到的不是字母,那么继续移动到下一个. Java Solution: Runtime beats ...

  4. LeetCode 8. String to Integer (atoi) (字符串到整数)

    Implement atoi to convert a string to an integer. Hint: Carefully consider all possible input cases. ...

  5. Html5 移动游戏开发

    有非常多游戏採用H5技术开发.比方三国来了.巴哈姆特之怒.切绳子等. 我们公司也有多款游戏用H5开发.H5开发成本低.效率高,方便做自己主动更新,可移植性好. 受益于H5技术,我们公司的非常多产品都非 ...

  6. Struts2之类型转换器的使用

    一.学习案例:通过在输入页面(input.jsp)用同一个输入框同一时候输入username和password,通过类型转换器在输出页面(output.jsp)分别输出username和passwor ...

  7. html 转word

    今日头条发表文章 python-docx — python-docx 0.8.6 documentation http://python-docx.readthedocs.io/en/latest/

  8. 一个尖括号能干什么,画一个笑脸开始(为了支持交互,它又增添了JavaScript。HTML页面也越来越臃肿。于是CSS便诞生了。API和核心代码的出现使HTML能够访问更复杂的软件功能--支持更高级的交互和云服务集成。这就是今天的HTML5)

    一个尖括号 < 一个尖括号能干什么 < ? 你可以编出一顶帽子 <(:-p 或一张笑脸 :-> 再或者更直接一些 20世纪90年代初,html作为一种简单标记语言面世,用于在互 ...

  9. ios--plist

    // // main.m // 03-plist文件的回顾 // // Created by xiaomage on 15/12/29. // Copyright © 2015年 小码哥. All r ...

  10. dotnet core 文档链接

    The installation was successful The following were installed at C:\Program Files\dotnet • .NET Core ...