[英]Safari 7.0.3 animate ScrollTop div not working?
I'm having trouble getting a #div with overflow:scroll to animate and scroll down to a specific part within the div in Safari 7.0.3. 我在使用溢出#div时遇到麻烦:滚动以设置动画并向下滚动到Safari 7.0.3中div中的特定部分。
It works just fine in FF, Opera, Chrome, but I can't get it to work in Safari for some reason? 它在FF,Opera,Chrome中正常运行,但是由于某种原因我无法在Safari中运行它吗? Does anybody know why and how I can work around this?
有人知道为什么以及如何解决这个问题吗? I've tried setting the #menuContainer to relative positioning, and it works but badly.
我尝试将#menuContainer设置为相对定位,但效果很好。 It will work sometimes and other times it won't.
它有时会工作,而其他时候则不会。
CSS 的CSS
#menu{
position:absolute;
display: block;
right: 0;
}
#menuContainer{
position:absolute;
overflow: scroll;
width: 350px;
right: 0;
}
HTML 的HTML
<div id="menu">
<div id="menuContainer">
<ul>
<li></li>
<li></li>
<li>.....
<ul>
</div>
</div>
jQuery jQuery的
$("#menuContainer").animate({scrollTop: $("li:nth-child("+varJumpTo+")").offset().top}, 500);
Okay, I found a solution. 好吧,我找到了解决方案。
It seems like in Safari it's best to .animate() scollTop after all of the content is loaded. 似乎在Safari中,最好在加载所有内容之后对.animate()scollTop进行设置。 So adding this around jQuery works:
因此,在jQuery周围添加以下内容即可:
$(window).load(function(){
$("#menuContainer").animate({scrollTop: $("li:nth-child("+varJumpTo+")").offset().top}, 500);
});
It was acting wonky because all of the content within the list needed to be loaded before we calculated the top() position of the div offset(). 这很奇怪,因为在计算div offset()的top()位置之前,需要加载列表中的所有内容。
Thanks! 谢谢! I hope this helps someone else out :D
我希望这可以帮助其他人:D
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.