javascript - 如何滚动并停留在特定元素所在的位置？

Question

这是我的代码:

$('html, body').stop().animate({scrollTop:$('.select').offset().top-80}, '100'); 

div{
border: 2px solid gray;
  padding: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<div> div1 </div>

<br><br><br><br><br><br><br><br><br><br><br>

<div> div2 </div>

<br><br><br><br><br><br><br><br><br><br><br>

<div class='select'> div3 </div>

<br><br><br><br><br><br><br><br><br><br><br>

<div> div4 </div>

<br><br><br><br><br><br><br><br><br><br><br>

<div> div5 </div>

而且它工作正常。我的问题只是关于跳跃。页面加载时，首先它会(跳转)到页面顶部，然后滚动到该特定位置。如何预防？我不想上升然后下降，我想要如果当前滚动在那个特定位置然后什么也不会发生。我该怎么做？

Answer 1

呈现文档(页面)时，默认情况下它总是将焦点放在页面顶部，不幸的是，css 没有单独提供任何技巧来设置它来克服它。

你能做的最好的事情就是围绕它使用 setTimeout 函数并延迟过渡以使其看起来更线性。

setTimeout(function(){
$('html, body').stop().animate({scrollTop:$('.select').offset().top-80}, 3000); },2000);

这是一个例子:http://jsfiddle.net/86829ryz/18/