Chrome 61 jQuery滚动不再工作了

时间:2017-09-06 09:29:34

标签: jquery css google-chrome scroll

自Chrome 61以来,我在滚动jquery 3.2.1命令时遇到了很多问题。它不再滚动了。

Chrome向我提供了控制台通知(该页面最后更新时间为2017年1月12日)。

  

Blink推迟了一项任务,以使滚动更顺畅。您的计时器和网络任务运行时间不应超过50毫秒,以避免这种情况。有关详细信息,请参阅https://developers.google.com/web/tools/chrome-devtools/profile/evaluate-performance/railhttps://crbug.com/574343#c40

示例:

console.log("start");
$('body').animate({ 
  scrollTop : $('#id').offset().top - 100
},3000,function(e) {
  console.log("end");
});

有没有人知道原因是什么以及我能用它做什么?

1 个答案:

答案 0 :(得分:10)

似乎溢出被设置为当前版本中的html(就像在-moz中一样。查看我做了一段时间的this question

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="inputBox">
  <label for="sofa">
    Sofa
    <span class="inputInner">
      <a class="minus">-</a>
      <input name="sofa" value="0">
      <a class="plus">+</a>
    </span>
  </label>
</div>

<div class="inputBox">
  <label for="table">
    Sofa
    <span class="inputInner">
      <a class="minus">-</a>
      <input name="table" value="0">
      <a class="plus">+</a>
    </span>
  </label>
</div>

<div class="inputBox">
  <label for="piano">
    Sofa
    <span class="inputInner">
      <a class="minus">-</a>
      <input name="piano" value="0">
      <a class="plus">+</a>
    </span>
  </label>
</div>

https://jsfiddle.net/4ebggecv/

或者您可以添加这些样式并保持动画正文

$(function() {
    console.log("start");
    $('html').animate({
        scrollTop: $('#my-id').offset().top - 100
    }, 3000, function(e) {
        console.log("end");
    });
});

https://jsfiddle.net/ykyt58ac/1/