如何发现用户是否使用jQuery滚动到HTML容器的末尾
How to find out if the user scrolled to the end of a HTML container with jQuery?
如何确定用户在可滚动容器中是向上滚动还是向下滚动?
jQuery提供任何机制吗?
css:
#container {
display: block;
width: 250px;
height: 25px;
background: green;
}
#scrolling {
width: 250px;
height: 300px;
backround: red;
overflow: auto;
}
http://jsfiddle.net/Hmaf2/2/
非常感谢!
Pat
$('#somediv').scrollTop()
会告诉你顶部的位置
-编辑-
$('#somediv').scroll(function(){
if($('#somediv').scrollTop()==0){
console.log('top')
}
})
是的,您可以访问可滚动容器的当前滚动顶部值。
jsFiddle在这里工作。
$('#scrolling').scroll(function() {
var scrollTop = $(this).scrollTop();
console.log(scrollTop);
});
您可以通过比较div:的高度、可滚动高度和滚动偏移量来测试滚动位置
$(document).ready(function(){
$('#scrolling').scroll(function(){
var scrollTop = $(this).scrollTop();
var iheight = $(this).innerHeight();
var sheight = this.scrollHeight;
var text = '';
if (scrollTop <= 5) {
text = 'top';
}
else if (scrollTop+5 >= sheight-iheight) {
text = 'bottom';
}
else {
text = scrollTop+' middle ('+iheight+','+sheight+')';
}
$('#result').text(text);
});
});
小提琴
本例从div的页边空白的顶部和底部保留了5个像素。
相关文章:
- 让HTML元素充当停止滚动的锚点
- Android在HTML容器中滚动,该容器具有CSS溢出属性
- 在向下滚动JS/HTML/CSS wordpress网站时替换徽标图像
- 滚动所有嵌套的滚动条,使HTML元素进入视图
- 使文本仅滚动HTML页面的一部分
- 如何发现用户是否使用jQuery滚动到HTML容器的末尾
- 在html中的图像上滚动文本
- html表格的浮动水平滚动条
- 如何使用位置获取滚动功能获取 HTML 中的元素标签
- ModalDialog:HTML表格应该是可滚动的,而不是整个页面
- 如何在HTML / CSS中填充垂直和滚动中间窗格(Chrome可以工作,但不能Firefox)
- CSS 溢出的滚动问题:滚动 HTML
- 滚动然后修复到 html 中的顶部标题
- HTML滚动按钮图像:如何使用Internet Explorer
- 如何使html滚动条从底部开始
- 阻止HTML滚动在元素内部滚动时,不隐藏滚动条
- 使用-webkit溢出滚动时更改HTML滚动条颜色:触摸
- 类似iPad的HTML滚动组件
- ASP.NET HTML 滚动框的基本计数器
- HTML滚动:跳转到页面的结束(水平)w/javascript