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. mtk display 架构

    Hwc Dispatch Layers  .Layer 的区分 每个layer 都会有对应的一个BufferQueue,BufferQueue都有一个mConnectapi属性,mConnectAPI ...

  2. nyoj_123_士兵杀敌(四)_201404131143

    士兵杀敌(四) 时间限制:2000 ms  |  内存限制:65535 KB 难度:5   描述 南将军麾下有百万精兵,现已知共有M个士兵,编号为1~M,每次有任务的时候,总会有一批编号连在一起人请战 ...

  3. RabbitMQ消息队列阻塞导致服务器宕机

    最近工作中存储服务器由于压力太大无法及时消费消息.这个过程中,导致RabbitMQ意外挂掉,无法访问.下面是部分问题分析过程. 麒麟系统服务器分析 1.服务器异常信息: [root@localhost ...

  4. Mysql修改自增主键的起始值及查询自增主键的下一个值

    MySQL [xxx_mall]> alter table shop_base_info  AUTO_INCREMENT=11000;Query OK, 0 rows affected (0.0 ...

  5. Ubuntu 16.04安装Synaptic Package Manager图形化APT管理工具

    安装: sudo apt-get install synaptic 启动:

  6. 前段集成解决方案grunt+yeoman初步认识

    1.什么是前段集成解决方案? 将前端研发领域中各种分散的技术元素集中在一起,并对常见的前端开发问题.不足.缺陷和需求,所提出的一种解决问题的方案 2.yeoman 应用的架构,模型!  相当于一个生成 ...

  7. ci 在阿里云访问的时候404

    最近想把ci 弄到阿里云去,结果发现,本地好好的,到了阿里云就404了.网上查了下 原来是 配置文件的问题. 配置文件就是 vhost下面的 **.conf文件  要有这个才行 location / ...

  8. Linux声卡驱动移植和測试

    一.分析驱动程序,依据开发板改动代码 代码太长,就不贴了,几个注意点: 1. 查看开发板原理图和S3C2410的datasheet,UDA1341的L3MODE.L3DATA.L3CLOCK分别与S3 ...

  9. LINKs: Xamarin.Forms + Prism

    LINK 1 - How to use Prism with Xamarin.Forms http://brianlagunas.com/first-look-at-the-prism-for-xam ...

  10. linux下非root用户怎样改动root权限的文件

           在linux下会出现把一些配置文件參数配错.rootpassword忘记等导致系统无法启动或进入root的窘迫境界.本文以redhat  enterprise linux server ...