单击并滚动顶部

Question

我遇到了部分战士中的offset.top问题。 http://jsfiddle.net/sz8YP/1/

即是说，点击下一个战斗机后，车轮压得太远。

$(".list-fighters li .toogle").click(function(e) { 
    $(".list-fighters li").removeClass("open"); 
    $(this).parent("li").toggleClass("open"); 
    $('html, body').animate({scrollTop: $(this).offset().top}, 100); 
}); 

有没有办法解决它？

Answer 1

你需要调用scrolltop()在超时，给DOM的时间从以前的通话$(".list-fighters li").removeClass("open");是修改了页面的高度，这样的更新offset().top：

var deez = this; 
setTimeout(function() { 
    $('html, body').animate({scrollTop: $(deez).offset().top}, 100); 
}, 300); 

测试后，更新到300ms以赶上身高的更新。

Answer 2

这都是因为你有几个动画在同一时间。其中一些用JavaScript定义，一些用CSS定义。

CSS（main.css的：233）

.list-fighters li { 
    transition: height 350ms ease; 
    -webkit-transition: height 350ms ease; 
} 

的JavaScript

$('html, body').animate({scrollTop: $(this).offset().top}, 100); 

正如你可以看到你开始动画坍塌开战斗机的描述，它需要350ms更新它的高度。你需要的是等待这段时间，让所有元素都有适当的高度。

var that = this; 
setTimeout(function() { 
    $('html, body').animate({scrollTop: $(that).offset().top}, 100); 
}, 350);