<!DOCTYPE html>

 <html>

 <head lang="en">

     <meta charset="UTF-8">

     <title></title>

     <style>

         body {

             height: 3000px;

         }

     </style>

 </head>

 <body>

 </body>

 </html>

 <script>

     //   var json = {left: 10, right: 10}  变异

     //json.left   json.top

     function scroll() {

         if(window.pageYOffset != null)  //  ie9+ 和其他浏览器

         {

             return {

                 left: window.pageXOffset,

                 top: window.pageYOffset

             }

         }

         else if(document.compatMode == "CSS1Compat")  // 声明的了 DTD

         // 检测是不是怪异模式的浏览器 -- 就是没有 声明<!DOCTYPE html>

         {

             return {

                 left: document.documentElement.scrollLeft,

                 top: document.documentElement.scrollTop

             }

         }

         return { //  剩下的肯定是怪异模式的

             left: document.body.scrollLeft,

             top: document.body.scrollTop

         }

     }

     window.onscroll = function() {

         console.log(scroll().top);

     }

 </script>

scrollTop兼容封装的更多相关文章

  1. input屏蔽历史记录 ;function($,undefined) 前面的分号是什么用处 JSON 和 JSONP 两兄弟 document.body.scrollTop与document.documentElement.scrollTop兼容 URL中的# 网站性能优化 前端必知的ajax 简单理解同步与异步 那些年，我们被耍过的bug——has

    input屏蔽历史记录   设置input的扩展属性autocomplete 为off即可 ;function($,undefined) 前面的分号是什么用处   ;(function($){$.ex ...

  2. requestAnimationFrame 完美兼容封装

    完美兼容封装: (function() { var lastTime = 0; var vendors = ['webkit', 'moz']; for(var x = 0; x < vendo ...

  3. JS-特效 ～ 05. 缓动框架兼容封装／回掉函数／兼容透明度／层级、旋转轮播图、正则表达式、验证表单注册账号、

    缓动函数中opcity  写百分值的值 JS一般不用小数运算,会照成精度丢失 元素的默*认透明度是 层级一次性赋值,不缓动 利用for…in为同一个父元素的子元素绑定属性 缓动框架兼容封装/回掉函数/ ...

  4. 获取scrollTop兼容各浏览器的方法，以及body和documentElement

    1.各浏览器下 scrollTop的差异 IE6/7/8: 对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 : 对于有do ...

  5. 【转】获取scrollTop兼容各浏览器的方法，以及body和documentElement是啥？

    1.各浏览器下 scrollTop的差异 IE6/7/8: 对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 : 对于有do ...

  6. scrollTop兼容处理

    使用jQuery2.0以下版本的scrollTop()函数来设置当然兼容性当然很好,但有时需要为滚动设置滑动效果.比如,使用animate函数,这里需要做些兼容性处理: 实例:http://sandb ...

  7. getElementsByClassName兼容 封装

    众所周知,JS获取DOM有个getElementsByClassName,非常方便,但是呢,为了兼容某些浏览器(你懂的).只能 进行封装下了.解决方法如下 <!DOCTYPE html> ...

  8. 关于scrolltop 兼容 IE6/7/8, Safari,FF的方法

    1.各浏览器下 scrollTop的差异IE6/7/8:对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 :对于有docty ...

  9. document.body.scrollTop与document.documentElement.scrollTop兼容

    这两天在写一个JS的网页右键菜单,在实现菜单定位的时候发现了这个问题:chrome居然不认识document.documentElement.scrollTop! 看前辈们的文章,纷纷表示如果有文档声 ...

随机推荐

  1. SpringMVC的入门例子

    MVC框架是什么 模型-视图-控制器(MVC)是一个众所周知的以设计界面应用程序为基础的设计模式.它主要通过分离模型.视图及控制器在应用程序中的角色将业务逻辑从界面中解耦.通常,模型负责封装应用程序数 ...

  2. Hibernate3.x异常No row with the given identifier exists 解决方法

    这个异常是在 多对一关系映射时,一方表中对应的数据不存在才抛出的.原来的配置: <many-to-one class="com.art.model.user.UserInfo" ...

  3. MariaDB卸载

    二进制安装方式的MariaDB卸载 关闭mysql服务 service mysql stop 或 /etc/init.d/mysql stop 或 mysqladmin shutdown -uroot ...

  4. Android Bitmap与String互转（转）

    /** * 图片转成string * * @param bitmap * @return */ public static String convertIconToString(Bitmap bitm ...

  5. Eventually Consistent(最终一致性)（转）

    应该说搞分布式系统必读的文章了,转过来,这是2008年12月Werner revise过的版本,先贴上内容简介:分布式系统的CAP理论 CAP理论(data consistency, system a ...

  6. oracle 多字段去重查询

      oracle 多字段去重查询 CreationTime--2018年6月29日15点11分 Author:Marydon 1.情景展示 需要对表BASE_MRI_DEVICE的COMPNAME.F ...

  7. SettingsPLSQLDeveloper

      迁移时间:2017年5月21日10:12:23Author:Marydon 一.常用配置项UpdateTime--2017年3月15日13:55:46注:没有安装Oracle数据库的情况下,前两步 ...

  8. SettingsMyEclipse

      迁移时间--2017年5月20日10:39:42 Author:Marydon-----------------------------------MyEclipse单独设置项---------- ...

  9. [SceneKit] 不会 Unity3D 的另一种选择

    概述 SceneKit和SpriteKit的区别简单的来说就是二维和三维的区别 详细 代码下载:http://www.demodashi.com/demo/10664.html 上周一, 相信很多人和 ...

  10. （二）Linux Shell编程——运算符、注释

    2.7 Shell运算符 Bash 支持很多运算符,包括算数运算符.关系运算符.布尔运算符.字符串运算符和文件测试运算符.原生bash不支持简单的数学运算,但是可以通过其他命令来实现,例如 awk 和 ...