Question

我使用以下代码在第一次加载时自动滚动页面：

$(document).ready(function(){

  $("body,html").delay(1000).animate({scrollTop: 300}, 1000);

});

但是，如果用户手动滚动页面并点击链接，我希望他能够返回到该链接，如果他在历史记录中导航回来。目前，如果用户返回，动画将再次触发，页面将滚动到顶部+ 300，从而中断工作流程。

Answer 1

您可以添加检查scrollTop是否为零的条件，然后才会触发自动滚动：

$(document).ready(function(){
  if( $(window).scrollTop() === 0 ){
    $("body,html").delay(1000).animate({scrollTop: 300}, 1000);
  }//if
});// document ready

或者更好的是：

$(document).ready(function(){
  setTimeout( checkAndScroll, 1000 );
});// document ready

function checkAndScroll(){
  if( $(window).scrollTop() === 0 ){
     $("body,html").animate({scrollTop: 300}, 1000);
  }
}//checkAndScroll()

当用户在1秒钟之前启动滚动时，第二种方法也会处理这种情况。

在历史记录中导航时阻止滚动动画触发

1 个答案: