gpt4 book ai didi

javascript - 动态显示一个分区取决于另一个分区的滚动条位置

转载 作者:行者123 更新时间:2023-11-28 08:51:50 25 4
gpt4 key购买 nike

我想显示另一个 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>

最佳答案

查看此链接...

How can I use JQuery to check if a div is scrolled all the way to the bottom?

对于您的代码,只需将 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/

关于javascript - 动态显示一个分区取决于另一个分区的滚动条位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19053543/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com