gpt4 book ai didi

jquery - 我如何让这个滚动只移动容器 div 而不是整个 body

转载 作者:太空宇宙 更新时间:2023-11-03 19:15:02 25 4
gpt4 key购买 nike

我正在使用 UIWebView 制作一个 HTML5 iOS 应用程序,我正在尝试制作它,以便当用户导航选项卡时,从一个选项卡到另一个选项卡有水平滑动/滚动效果。滑动/滚动效果有效,但它正在移动整个文档,而不仅仅是容器 div。我想要的只是让容器 div 中的元素滚动/滑动,让页脚保持原位。

<body> 
<div id="container">
<div id="home-content">
<div></div>
<div>
<div></div>
<div></div>
</div>
<div></div>
</div>
<div id="gallery-content">
</div>
<div id="merch-content">
</div>
<div id="apps-content">
</div>
<div id="press-content">
</div>
<div id="footer">
<ul class="nav">
<li class="home active"><span><a href="#home-content" style="text-decoration:none;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></span></li>
<li class="gallery"><span><a href="#gallery-content" style="text-decoration:none;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></span></li>
<li class="merch"><span><a href="#merch-content" style="text-decoration:none;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></span></li>
<li class="apps"><span><a href="#apps-content" style="text-decoration:none;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></span></li>
<li class="press"><span><a href="#press-content" style="text-decoration:none;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></span></li>
</ul>
</div>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="js/jquery.easing.1.3.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function() {
$('ul.nav a').bind('click',function(event){
var $anchor = $(this);
$('html, body').stop().animate({
scrollLeft: $($anchor.attr('href')).offset().left
}, 1000);
event.preventDefault();
});
});
</script>
</body>

最佳答案

您的 div#footer 位于您的 div#container 内。

将它移到 div#container 之外,然后将脚本更改为

$('#container').stop().animate({
scrollLeft: $($anchor.attr('href')).offset().left
}, 1000);

关于jquery - 我如何让这个滚动只移动容器 div 而不是整个 body ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6990403/

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