javascript - .slideDown() 在特定高度后仅一次，听 .scrollTop

Question

我遇到了这个问题，我有一个部分(“.aboutsection”)一开始是隐藏的，需要在点击网页上的某个点时显示出来，然后开始为 .slideDown() 设置动画。我让它工作了，但每次我滚动到那个特定点时，它都会一遍又一遍地开始动画，这不是我想要的。

我寻求过不同的解决方案，但它们都行不通，也不符合我的需求。(所以请不要将其作为副本)

$(window).scroll(function(){

 var wScroll = $(this).scrollTop();
 $(".aboutcontainer").hide();

 [...] (left out other function listening to scrolltop)

 if(wScroll > $('section.about').offset().top - ($(window).height() / 1.2)) {

  $(".aboutcontainer").slideDown(1400,'easeInOutQuart');

 }

});

我试图让该函数检查“.aboutcontainer”是“:visible”还是“:hidden”，以便仅在隐藏该部分时为其设置动画，但这没有用。

Answer 1

您可能只设置一个标志并作为条件的一部分进行检查:

var expanded = false;
$(".aboutcontainer").hide();
$(window).scroll(function(){

  var wScroll = $(this).scrollTop();

  [...] (left out other function listening to scrolltop)

  if(!expanded && wScroll > $('section.about').offset().top - ($(window).height() / 1.2)) {
    expanded = true;

   $(".aboutcontainer").slideDown(1400,'easeInOutQuart');

  }

});