我有一个带有2个滚动的div
。我喜欢滚动到结束时向用户显示一条消息。
这是我的div:
<div id="scrollbox">
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
<div>this is a test.this is a test.this is a test.this is a test</div>
</div>
这是我的css:
#scrollbox {
width: 300px;
height: 150px;
overflow: auto;
}
这是我的javascript:
$(document).ready(function () {
$("#scrollbox").scroll("scroll",function () {
if ($(this).scrollTop() + $(this).outerHeight() >= $(this)[0].scrollHeight) {
alert(1);
}
});
});
当div有一个卷轴时,一切正常。 我已经让你可以看到。 http://jsfiddle.net/L5f7qtux/
但是当div有两个滚动是有问题的。 问题是当向后滚动到末端时,向用户显示几条消息。 我已经让你可以看到。 http://jsfiddle.net/L5f7qtux/1/
注意:仅在Firefox浏览器中出现此问题。
答案 0 :(得分:1)
只需替换
$(this).outerHeight()
与
$(this)[0].clientHeight
我把它与变化分开,它解决了我的FF中的问题。
祝你好运。