首页 > 解决方案 > scoliIntoview jQuery 插件没有做任何事情

问题描述

我目前正在使用来自https://github.com/litera/jquery-scrollintoview的插件 scrollintoview并且无法正常工作,当我使用 jQuery.scrollintoview 进行测试时,该插件已准备就绪。

还测试了其他插件以进行滚动并且也无法正常工作。

这是我的js函数:

function scrollToId(id){
  $('#'+id).scrollintoview({
    duration: 1000,
    direction: 'vertical',
    complete: function () {
      console.log('Ready');
    }
  });
}

这里是 index.html 中 js 文件的顺序

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-scrollintoview/1.8/jquery.scrollintoview.min.js"></script>
<script src="js/index/index.js"></script>

使用此功能的一个示例是<button onclick="goToId('design')" ><h5>Design</h5></button> ,应该会上升到<div id="design"><h1>Design</h1></div> 并且控制台没有打印任何错误。

还使用来自https://github.com/flesler/jquery.scrollTo的插件 scrollTo 进行了测试,但它具有相同的行为。

标签: javascriptjqueryhtml

解决方案


当您在 body 样式中使用 overflow-y:hidden 属性时,该插件不起作用:<body style="overflow-y:hidden;">


推荐阅读