动态显示除法取决于另一个除法的滚动条位置
showing a division dynamically depends on scroll bar position of another divison
我想展示另一个div(#footer)
。每当我滚动到div(#right) 的末尾时,都尝试过这样,但它不起作用。
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
var bot=$('#right')[0].scrollHeight;
var pos=$("#right")[0].scrollTop +$("#right")[0].clientHeight;
if(bot==pos){
$("#footer").css("display","block");
}
else{$("#footer").css("display","none");
}
});
</script>
<style type="text/css">
#left{
width:10px;
height:100px;
overflow:hidden;
background-color:blue;
}
#right{
width:52px;
height:100px;
overflow:auto;
background-color:green;
position:absolute;
top:7px;left:20px;
}
#footer{
width:70px;height:50px;
background-color:yellow;
}
</style>
</head>
<body>
<div id="left">
</div>
<div id="right">
a b c d e f g h i j k l m n o p q r s t u v w x y z
</div>
<div id="footer" style="display:none">
</div>
</body>
</html>
查看此链接...
如何使用 JQuery 检查div 是否一直滚动到底部?
对于您的代码,只需将 javascript 更改为此....
$(document).ready(function(){
$('#right').bind('scroll',chk_scroll);
});
function chk_scroll(e)
{
var elem = $(e.currentTarget);
if (elem[0].scrollHeight - elem.scrollTop() == elem.outerHeight())
{
$("#footer").show();
}
}
此处显示
http://jsfiddle.net/rsP9p/
相关文章:
- CSS-若窗口太小,滚动条会出现在“表格”单元格上
- 禁用(而不是隐藏)浏览器滚动条
- 在firefox和chrome中的左侧显示iframe滚动条
- jquery:将动画绑定到滚动条位置的更好方法
- 在窗口中添加滚动条
- 如何查明鼠标按下事件是否发生在滚动条上或元素中的其他任何位置
- 使用没有插件的javascript自定义滚动条
- CodeMirror.禁用垂直滚动条
- 在滚动时,在隐藏滚动条和隐藏溢出的同时触发事件
- 可以'无法使滚动条正常工作
- 强制滚动条覆盖页面内容
- 如何隐藏滚动条,但希望它继续工作
- 滚动所有嵌套的滚动条,使HTML元素进入视图
- 使用浏览器滚动条而不是iframe滚动条
- 滚动条在关闭引导对话框后消失
- javascript/获取滚动条位置的回调
- 可调整滚动条大小
- 去掉滚动条
- ext-js网格面板滚动条不适用于jquery
- 动态显示除法取决于另一个除法的滚动条位置