Question

我正在使用带有HTML的Jquery并尝试滚动到下一个Div with Animation。可悲的是，没有什么能帮助我。我想在左下角有一个图标，滚动到下一个div。这是我的基本divs

 <body>

    <div id="scroller"><a class="display" href="#">Link </a></div>

    <div class="menu-wrap"></div>
    <div id="section1" class="section current"></div>
     <div id="section2" class="section">  </div>
     <div id="section3" class="section">  </div>
     <div id="section4" class="section"></div>
     <div id="section5" class="section"></div>
     <div id="section6" class="section"></div>
     <div id="section7" class="section"></div>
     <div id="section8" class="section"></div>
     <div id="footer"></div>
    </div>

我想在＆＃34;部分＆＃34;之间滚动。我在每个部分中都有其他Div但是不同的ID。我不认为这应该是一个问题？似乎没什么用，我的jquery是

    $(document).ready(function(){
   $('a.display').on('click', function(e) {
      e.preventDefault(); 
      var offset = $(this).next().find('div#section').offset().top;
      $('html, body').stop().animate({ scrollTop: offset }, 400);
   });
});

Answer 1

您的代码没有按照您的想法行事。

首先，$(this).next()不返回任何元素。如果确实如此，您应该使用.find('div.section')代替.find('div#section')。此外，对于“滚动到下一个”功能，您可以以某种方式知道当前滚动位置并将其与该位置进行比较预计下一个。

考虑到这一点，我建议使用jquery-scrollTo插件，而不是发明自己的实现。

以下是一个示例用法：JSFiddle

使用带有上一个和下一个图标的Jquery滚动到下一个Div

1 个答案: