原生js--兼容获取窗口滚动条位置和窗口大小的方法
各个浏览器对获取获取窗口滚动条位置和窗口大小没有提供统一的API,以下是对其封装,解决兼容性问题
/**
* 获取浏览器视口的大小(显示文档的部分)
*
*/
function getViewPortSize(){
// 除IE8及更早的版本以外的浏览器
if( window.innerWidth != null ){
return {
w : window.innerWidth,
h : window.innerHeight
}
}
// 标准模式下的IE
if( document.compatMode == "css1Compat" ){
return {
w : document.documentElement.clientWidth,
h : document.documentElement.clientHeight
}
}
// 怪异模式下的浏览器
return {
w : document.body.clientWidth,
h : document.body.clientHeight
}
}
/**
* 获取窗口滚动条的位置
*/
function getScrollOffset(){
// 除IE8及更早版本
if( window.pageXOffset != null ){
return {
x : window.pageXOffset,
y : window.pageYOffset
}
}
// 标准模式下的IE
if( document.compatMode == "css1Compat" ){
return {
x : document.documentElement.scrollLeft,
y : document.documentElement.scrollTop
}
}
// 怪异模式下的浏览器
return {
x : document.body.scrollLeft,
y : document.body.scrollTop
}
}
原生js--兼容获取窗口滚动条位置和窗口大小的方法的更多相关文章
- js获取窗口滚动条高度、窗口可视范围高度、文档实际内容高度、滚动条离浏览器底部的高度
1.获取窗口可视范围的高度 //获取窗口可视范围的高度 function getClientHeight(){ var clientHeight=0; if(document.body.clientH ...
- html通过css,js实现div悬浮效果总汇,如原生JS实现滚动到一定位置实现div悬浮
在我们的实际开发中,经常会遇到页面中需要悬浮效果,比如最早的客服联系,对联悬浮广告等,今天为大家介绍一些如何实现div悬浮的效果. 传统的fixed实现: 通过css中的属性position参数设为f ...
- JS打开新窗口防止被浏览器阻止的方法
这篇文章主要介绍了JS打开新窗口防止被浏览器阻止的方法,分析对比了常用方法与改进方法,是非常实用的技巧,需要的朋友可以参考下 本文实例讲述了JS打开新窗口防止被浏览器阻止的方法.分享给大家供大家参考. ...
- JS打开新窗口防止被浏览器阻止的方法[转]
本文实例讲述了JS打开新窗口防止被浏览器阻止的方法.分享给大家供大家参考.具体分析如下: 用传统的window.open()方式打开新窗口,会被浏览器阻止,那么,我们如何才能让JS打开新窗口不被浏览器 ...
- 原生JS中获取位置的方案总结
获取鼠标当前位置 clientY.clientX: 鼠标当前位置 相对于 浏览器可视区域顶部.浏览器可视区域左部 的位置: pageY.pageX: 鼠标当前位置 相对于 文档顶部.文档左部的位置: ...
- js中获取窗口高度的方法
取窗口滚动条滚动高度 function getScrollTop() { var scrollTop=0; if(document.documentElement&&document. ...
- 原生js中获取this与鼠标对象以及vue中默认的鼠标对象参数
1.通过原生js获取this对象 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...
- Java: 获取当前执行位置的文件名/类名/方法名/行号
在 JAVA 程序有时需要获取当前代码位置, 于是就利用 Thread.currentThread().getStackTrace() 写了下面这个工具类, 用来获取当前执行位置处代码的文件名/类名/ ...
- 原生JS和JQ窗口定位属性对照表
位置 javascript jquery 兼容性 窗口位置离屏幕左偏移 var leftPos = (typeof window.screenLeft == "number") ? ...
随机推荐
- winfrom 使用NPOI导入导出Excel(xls/xlsx)数据到DataTable中
1.通过NUGET管理器下载nopi,在引入命令空间 using System; using System.Collections.Generic; using System.Text; using ...
- 转:关于VS2012连接MySql数据库时无法选择数据源
原文来自 http://www.cnblogs.com/sanduo8899/p/3698617.html 您的C#开发工具是用VS2012吗? No! return; 您的数据库用的 ...
- js 跨域 Jquery取得iframe中元素的几种方法
http://www.jb51.net/article/34942.htm 收集利用Jquery取得iframe中元素的几种方法 : 父页面访问子页面 $(document.getElementByI ...
- snmp简单使用
preface snmp 不多说 环境介绍 1.使用CentOs7的系统,内核版本为3.10.0-123.el7.x86_64 2.ip地址为192.168.56.12 安装snmp 1.yum安装: ...
- 快速排查SQL服务器阻塞语句
SELECT*FROM sys.sysprocesses and blocked> --可以查看阻塞 SELECT SPID=p.spid, DBName =convert(CHAR(),d.n ...
- 既使用maven又使用lib下的Jar包
maven 使用本地包 lib jar包 依赖一个lib目录 解决方法: # 把本地的lib加入maven编译时的依赖路径 From:http://blog.chinaunix.net/uid-231 ...
- [原]巧用RenderTexture
郑重声明:转载请注明出处 U_探索 本文诞生于面试过程中这道题:NGUI如何制作3D角色的显示.(大概是这样) 呵呵 没事出去面试面试,考核考核自己也是一种不错的方式哦!不过现在u3d面试,貌似比以 ...
- [SLAM] Little about SLAM
Books from Zhihu: 幽默一把 看完Gonzalez:嗯,好像很好玩的样子,我也来搞一搞.看完Price:什么鬼,怎么这么多公式,公式看不懂肿么破.看完Szeliski:原来用一千页的书 ...
- OC中Runtime浅析
近期了解了一下OC的Runtime,真的是OC中非常强大的一个机制,看起来比較底层,但事实上能够有非常多活用的方式. 什么是Runtime 我们尽管是用Objective-C写的代码,事实上在运行过程 ...
- java痛苦学习之路[十]--日常问题汇总
FIddler2 1.FIddler2 request请求的參数出现中文乱码问题时,须要进行一下设置: 打开注冊表编辑器,找到HKCU\Software\Microsoft\Fiddler 2\,在 ...