scrollTop兼容封装
<!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兼容封装的更多相关文章
- input屏蔽历史记录 ;function($,undefined) 前面的分号是什么用处 JSON 和 JSONP 两兄弟 document.body.scrollTop与document.documentElement.scrollTop兼容 URL中的# 网站性能优化 前端必知的ajax 简单理解同步与异步 那些年，我们被耍过的bug——has
input屏蔽历史记录 设置input的扩展属性autocomplete 为off即可 ;function($,undefined) 前面的分号是什么用处 ;(function($){$.ex ...
- requestAnimationFrame 完美兼容封装
完美兼容封装: (function() { var lastTime = 0; var vendors = ['webkit', 'moz']; for(var x = 0; x < vendo ...
- JS-特效 ～ 05. 缓动框架兼容封装／回掉函数／兼容透明度／层级、旋转轮播图、正则表达式、验证表单注册账号、
缓动函数中opcity 写百分值的值 JS一般不用小数运算,会照成精度丢失 元素的默*认透明度是 层级一次性赋值,不缓动 利用for…in为同一个父元素的子元素绑定属性 缓动框架兼容封装/回掉函数/ ...
- 获取scrollTop兼容各浏览器的方法，以及body和documentElement
1.各浏览器下 scrollTop的差异 IE6/7/8: 对于没有doctype声明的页面里可以使用 document.body.scrollTop 来获取 scrollTop高度 : 对于有do ...
- 【转】获取scrollTop兼容各浏览器的方法，以及body和documentElement是啥？
1.各浏览器下 scrollTop的差异 IE6/7/8: 对于没有doctype声明的页面里可以使用 document.body.scrollTop 来获取 scrollTop高度 : 对于有do ...
- scrollTop兼容处理
使用jQuery2.0以下版本的scrollTop()函数来设置当然兼容性当然很好,但有时需要为滚动设置滑动效果.比如,使用animate函数,这里需要做些兼容性处理: 实例:http://sandb ...
- getElementsByClassName兼容 封装
众所周知,JS获取DOM有个getElementsByClassName,非常方便,但是呢,为了兼容某些浏览器(你懂的).只能 进行封装下了.解决方法如下 <!DOCTYPE html> ...
- 关于scrolltop 兼容 IE6/7/8, Safari,FF的方法
1.各浏览器下 scrollTop的差异IE6/7/8:对于没有doctype声明的页面里可以使用 document.body.scrollTop 来获取 scrollTop高度 :对于有docty ...
- document.body.scrollTop与document.documentElement.scrollTop兼容
这两天在写一个JS的网页右键菜单,在实现菜单定位的时候发现了这个问题:chrome居然不认识document.documentElement.scrollTop! 看前辈们的文章,纷纷表示如果有文档声 ...
随机推荐
- 1z0-052 q209_2
2: View the Exhibit to examine the output produced by the following query at three different times s ...
- 图片预加载插件 preLoad.js
1.preLoad.js插件 /*! * preLoad.js v1.0 * (c) 2017 Meng Fangui * Released under the MIT License. */ (fu ...
- JSONP简单例子
jsonp的原理很简单,主要利用了HTML中所有有src的属性的标签可以跨域的特点,利用script的src进行get请求,后端输出一段js代码的字符串在script中便会执行. 当然后端输出普通的j ...
- R语言中数据结构
R语言还是有点古老感觉,数据结构没有Python中那么好用.以下简单总结一下R语言中经常使用的几个数据结构. 向量: R中的向量能够理解为一维的数组,每一个元素的mode必须同样,能够用c(x:y)进 ...
- 〖Linux〗Ubuntu13.04解决Chrome的flash中文乱码的问题。
1. 安装flash sudo aptitude install flashplugin-installer 2. 禁用chrome自带的flash插件 在chrome浏览器中输入 chrome:// ...
- Android 华为U8818真机调试 无法打印Logcat
摘抄至:http://blog.csdn.net/studyalllife/article/details/8558258 在我们使用真机进行Android应用调试时,无法获得调试信息,错误提演示样例 ...
- Android网络开发之Socket通信
HTTP通信中Client发送的每次请求都需要Server回送响应,在请求结束后,Client会主动释放连接.从建立连接到隔壁连接的过程成为一次连接.要保持Client程序的在线状态,需要不断地向Se ...
- JavaScript中的数组与伪数组的区别
在JavaScript中,除了5种原始数据类型之外,其他所有的都是对象,包括函数(Function). 基本数据类型:String,boolean,Number,Undefined, Null 引用数 ...
- HDUOJ----The Number Off of FFF
The Number Off of FFF Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Ot ...
- C#中Windows Media Player控件使用实例|方法
Windows Media Player控件Windows Media Player是一种媒体播放器,可以播放当前最流行的音频.视频文件和大多数混合型的多媒体文件.为了便于程序的开发,Visual S ...