单击并滚动顶部

Click and scrollTop

本文关键字：顶部 滚动 单击      更新时间：2023-09-26

我在部分战斗机中的 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);
});

有没有办法解决它？

您需要

在超时时调用scrolltop()，以使 DOM 有时间更新您之前修改页面高度的调用$(".list-fighters li").removeClass("open");的offset().top，如下所示：

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

测试后，更新到 300 毫秒以赶上高度更新。

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

CSS （主.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);
相关文章：