scrollTop 在 jQuery 表现疯狂

scrollTop is acting crasy in jQuery

我正在创建一个小型网站,我想要的是当我调整 windows 大小时滚动条应该升到顶部所以我写了一个小函数并在 <body onresize="resize()"> 这是我的功能

 function resize(){
        $("html, body").animate({
          scrollTop: 0
      }, 600);
            return false;
        }

现在我想要的是好的,但现在我不能向下滚动一些 times.the 滚动条一次又一次地向上滚动,这是为什么

我想在评论中回复,但我的声誉还不够高。我建议不要在调整大小时自动滚动到顶部。这是糟糕的用户体验。您应该提供一个滚动到顶部的选项。一个例子是当 window 调整大小或用户向下滚动时出现的按钮。如果用户单击该按钮,它会将它们滚动到 window.

的顶部

好吧,我找到了答案,所以我必须等到调整大小完成才能向上移动滚动条

答案是

var resizeId;
$(window).resize(function() {
  clearTimeout(resizeId);
  resizeId = setTimeout(doneResizing, 500);
});


function doneResizing() {
  $("html, body").animate({
    scrollTop: 0
  });
}
<body>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>
  <h1>asd</h1>