js获取浏览器滚动条距离顶端的距离
最近在做项目的时候遇到需要用js获取滚动条距离窗口顶端的距离和js获取浏览器可视化窗口的大小,在这儿做一个整理保存:
一、jQuery获取的相关方法
jquery 获取滚动条高度 获取浏览器显示区域的高度 : $(window).height();
获取浏览器显示区域的宽度 : $(window).width();
获取页面的文档高度 : $(document).height();
获取页面的文档宽度 :$(document).width(); 获取滚动条到顶部的垂直高度 : $(document).scrollTop();
获取滚动条到左边的垂直宽度 : $(document).scrollLeft(); 计算元素位置和偏移量: $(id).offset(); offset方法是一个很有用的方法,它返回包装集中第一个元素的偏移信息。默认情况下是相对body的偏移信息。结果包含 top和left两个属性。 offset(options, results)
options.relativeTo 指定相对计 算偏移位置的祖先元素。这个元素应该是relative或absolute定位。省略则相对body。
options.scroll 是否把 滚动条计算在内,默认TRUE
options.padding 是否把padding计算在内,默认false
options.margin 是否把margin计算在内,默认true
options.border 是否把边框计算在内,默认true
但是我在使用jQuery的方法的时候在IE6上会发生不兼容现象。
二、使用js获取的相关方法
getScrollTop()使用这个方法在IE、谷歌和火狐上都能获取,当然这不是我原创的,也是有哥们贴网上的,我只是在此收藏整理一下。
js获取浏览器滚动条距离顶端的距离的更多相关文章
- [Jquery] js获取浏览器滚动条距离顶端的距离
需要用js获取滚动条距离窗口顶端的距离和js获取浏览器可视化窗口的大小 一.jQuery获取的相关方法 jquery 获取滚动条高度 获取浏览器显示区域的高度 : $(window).height( ...
- JS 获取浏览器窗口大小
JS 获取浏览器窗口大小 <script> // 获取窗口宽度 if (windows.innerWidth) { winWidth = windows.innerWidth; } els ...
- JS 获取浏览器窗口大小clientWidth、offsetWidth、scrollWidth
常用: JS 获取浏览器窗口大小 // 获取窗口宽度 if (windows.innerWidth) winWidth = windows.innerWidth; else if ((docume ...
- JS 获取浏览器和屏幕宽高等信息代码
JS 获取浏览器和屏幕宽高等信息. 网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:doc ...
- js获取浏览器高度和宽度值,尽量的考虑了多浏览器。
js获取浏览器高度和宽度值,尽量的考虑了多浏览器. IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ...
- js获取浏览器基本信息:document.body.clientWidth/clientHeight/scrollWidth/scrollTop。(转)
js获取浏览器基本信息:document.body.clientWidth/clientHeight/scrollWidth/scrollTop. 分类: js.jquery.ext.js技术2011 ...
- 【转】js 获取浏览器高度和宽度值(多浏览器
原文地址:http://www.jb51.net/article/19844.htm js获取浏览器高度和宽度值,尽量的考虑了多浏览器. IE中: document.body.clientWidth ...
- js获取浏览器高度
常用: JS 获取浏览器窗口大小 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 // 获取窗口宽度 if (window.innerWidth) winWidth = ...
- js获取浏览器窗口大小
摘抄:https://blog.csdn.net/qq_27628085/article/details/81947478 常用: JS 获取浏览器窗口大小 // 获取窗口宽度 if ...
随机推荐
- C#list泛型集合
//创建list泛型集合 List<int> ilist = new List<int>(); ilist.Add(); ilist.Add(); ilist.AddRange ...
- 常用mysql笔记
1.insert into ... values insert into tables (col1,col2) values (1,2),(2,3); 2.insert into ... select ...
- Ajax动态刷新验证码图片
一> 原理: 把用代码生成的图片存放到硬盘当中,然后在返回存储路径把图片通过图片标签的 src 属性 自动加载到浏览器中 二> 步骤 1. 首先用GDI+ 绘图 把验证码图片给绘制出来 2 ...
- [Mugeda HTML5技术教程之5] 创建新作品
前一节,我们介绍了Mugeda Studio.这一节我们讲一下怎么通过Studio创建新作品.首先登陆网站,如果还没有登陆账号,你可以登录 www.mugeda.com 免费注册一个.登录网站后,点击 ...
- 腾讯CMEM的PHP扩展(转载)
题外话最近公司在做相关的业务,由于Memcached协议缺少返回码,为了保证业务数据的安全性,不得已只好自己写个扩展来实现需求. 基于memcache扩展的2.2.6的稳定版开发而来.代码已经开源,有 ...
- 文成小盆友python-num3 集合,函数,-- 部分内置函数
本接主要内容: set -- 集合数据类型 函数 自定义函数 部分内置函数 一.set 集合数据类型 set集合,是一个无序且不重复的元素集合 集合基本特性 无序 不重复 创建集合 #!/bin/en ...
- 关于 VS2013监视窗口的内存面板及寄存器面板
1.插入断点,按F5调试,2.选择菜单项 debug-窗口-3.即可找到您要的监视窗口.
- unexpected problem
一个比较有趣的字符串问题,问题描述如下 大体意思就是给定一个字符串s以及一个整数m,找出一个能满足以上三个条件的字符串t的个数对10e9 + 7 取余输出. 第二三条是关键,t.s = s.t 举个例 ...
- OCR中的倾斜矫正
电面中被问到了做的LPR,简单的介绍了下后又问到了关于如何矫正倾斜角的问题.答得比较含糊,所以今天来补充一下. 倾斜矫正的方法有很多种,包括基于Hough变换的矫正,基于字符投影的倾角矫正,常规线性角 ...
- Swift类和结构体定义-备
Swift中的类和结构体定义的语法是非常相似的.类使用class关键词定义类,使用struct关键词定义结构体,它们的语法格式如下: class 类名 { 定义类的成员 } struct 结构体名 { ...