1、jquery获取滚动条高度使用scrollTop()方法。
2、首先我们新建一个长篇的HTML文档。
3、然后我们编辑JS脚本，使用scroll()方法，监听网页滚动。
4、然后我们使用scrollTop()获取垂直滚动距离。
5、然后保存文件，查看获取的垂直滚动距离即可。
<body>
<div style="border: 1px solid red;height:200px;width: 200px;"></div>
<script>
$(function(){
alert($("div")[0]offsetWidth)
})
</script>
</body>
这是我刚写的一个例子，你可以看一下，可能不太好。
下面这两个是我在网上搜到直接复制的
标签元素的宽高值获取
//绝对宽度
ObjoffsetWidth
//绝对高度
ObjoffsetHeight
你可以尝试以下代码：
windowonresize=resizeBannerImage;//当窗口改变宽度时执行此函数function resizeBannerImage()
{
var winW = $(window)width();
va if( $(window)width() > 600 ) {
/ 这里是要执行的代码 /
}
}
知识延展：
几个简单的jQuery使用方法1响应事件。在JavaScript中，经常会用到 onclick=“javascript函数”，但是这个方法将页面的设计与逻辑过于紧密的耦合在一起，并不漂亮，可以用jQuery，如下：
$("#check_un")click(function(event){alert("hello");
eventpreventDefault();
});1234
2将id为title处的内容显示出来
var title = $("#title")html();alert(title);12
3得到与类关联的图像的src值
var title = $("#title")html();alert(title);12
4统计项目符号的个数
var count = $("li")size();alert(count);12
5循环处理符号项
$('li')each(function(){alert($(this)html());
});123
6修改页面元素用html()方法
$("#title")html("the awesomest book title ever");大家在有时的网页设计中，前端会出现这样一个问题，因为左侧的侧边导航只有几个链接，很短，而右边的正文部分有可能会很长，怎么才能让左侧的背景能一直随着右侧的内容高度的增加而增加呢？当然，这种解决方法有两种，一种就是让左侧的导航漂浮，在右侧下拉或者是窗口拉出了左侧的高度时置顶，像糗事百科右侧的广告那样，这种方法现在也很流行，不过，我们今天不讲这种，讲的是另一种方法，让左右两边的div的高度能一致，随时一致，如果内容是固定的话，好做，左右固定高度，如果右侧的内容不固定呢？还是有办法得！
这种问题大多都是软件系统或者是一些后台中常用的，方法很简单，利用jquery获取右侧的高度，使得左侧和右侧的高度保持一致就OK啦！废话不多，上代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 10 Transitional//EN"
">
一、途径：
第一种情况就是宽高都写在样式表里，就比如#div1{width:120px;}。这中情况通过#div1stylewidth拿不到宽度，而通过#div1offsetWidth才可以获取到宽度。
第二种情况就是宽和高是写在行内中，比如style="width:120px;"，这中情况通过上述2个方法都能拿到宽度。
二、小结：
因为idoffsetWidth和idoffsetHeight无视样式写在样式表还是行内，所以我们获取元素宽和高的时候最好用这2个属性。注意如果不是写在行内style中的属性都不能通过idstyleatrr来获取。
三、代码：
var o = documentgetElementById("view");
var h = ooffsetHeight; //高度
var w = ooffsetWidth; //宽度
参考资料
js获取Html元素的实际宽度高度的方法脚本之家[引用时间2017-12-29]
获取浏览器显示区域的高度 ：
$(window)height();
获取浏览器显示区域的宽度 ：
$(window)width();
获取页面的文档高度 ：
$(document)height();
获取页面的文档宽度 ：
$(document)width();
获取滚动条到顶部的垂直高度 ：
$(document)scrollTop();
获取滚动条到左边的垂直宽度 ：
$(document)scrollLeft();
计算元素位置和偏移量：
$(id)offset();
获取浏览器显示区域的高度 ： $(window)height();
获取浏览器显示区域的宽度 ：$(window)width();
获取页面的文档高度 ：$(document)height();
获取页面的文档宽度 ：$(document)width();
获取滚动条到顶部的垂直高度 ：$(document)scrollTop();
获取滚动条到左边的垂直宽度 ：$(document)scrollLeft();
计算元素位置和偏移量：$(id)offset();
offset方法是一个很有用的方法，它返回包装集中第一个元素的偏移信息。默认情况下是相对body的偏移信息。结果包含 top和left两个属性。
offset(options, results)
optionsrelativeTo指定相对计
算偏移位置的祖先元素。这个元素应该是relative或absolute定位。省略则相对body。
optionsscroll是否把
滚动条计算在内，默认TRUE
optionspadding是否把padding计算在内，默认false
optionsmargin
是否把margin计算在内，默认true
optionsborder是否把边框计算在内，默认true
子页面控制父页面：
parentdocumentdocumentElementscrollTop;
parentdocumentdocumentElementclientHeight;
以上就是关于jquery获取滚动条高度和位置全部的内容，包括:jquery获取滚动条高度和位置、页面上有一个文本框，文本框里含有table代码，如何用js或jq，获取table代码里的width值和height值、如何用jquery实现实时监控浏览器宽度等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）