jQuery滚动到下一部分

Question

有人可以帮忙吗？

我似乎有两个问题：

页面没有滚动并且
当触发滚动单击3倍时，.top是未定义的。

.hero-banner是全屏幻灯片。 单击.trigger-scroll ，页面需要滚动到sections.scroll-here。 到达最后一节时，需要滚动到顶部。

预先感谢您的回答。

HTML：

    <section class="hero-banner">full screen section</section>
    <div class="trigger-scroll"></div>
    <section class="scroll-here" id="first-section">some content</section>
    <section class="scroll-here" id="second-section">some content</section>
    <section class="scroll-here" id="third-section">some content</section>

JS：

            $(document).ready(function() {
              $('.page-scroller', function() {
                var $scrollSection = $('.scroll-here')
                var $scrollTrigger = $('.trigger-scroll')
                var nextSection = 0;

                $scrollTrigger.on( 'click', function() {
                  $(this).removeClass('go-to-top');

                  // If at last section, scroll back to top on next click:
                  if (nextSection >= $scrollSection.length) {
                    $('html, body').animate({ scrollTop: 0 }, 1000);
                    nextSection = 0;
                    return;
                  }

                  // If you've already scrolled down and then click button, run a check
                  // to find next section position so you don't go backwards:
                  while ( $('body').scrollTop() > $($scrollSection[nextSection]).offset().top ) {
                    nextSection++;
                  }

                  // If next section is the last, add class to rotate arrow graphic:
                  if (nextSection === ($scrollSection.length - 1)) {
                    $(this).addClass('go-to-top');
                  }

                  // Move to next section and increment counter check:
                  $( 'html, body' ).animate({ scrollTop: $($scrollSection[nextSection]).offset().top }, 1000);
                  nextSection++;
                });
              });
            });

Answer 1

在试图弄清楚为什么<scrollTop>不能正常工作几个小时后，我发现<body>标记的CSS样式为<height:100%;> ，这弄乱了<offset> 。 亚历克斯感谢您的帮助。 对于其他人，这是一个有效的JSFiddle链接

jQuery滚动到下一部分

问题描述

1 个解决方案

解决方案1
0 2014-08-22 00:36:15

jQuery滚动到下一部分

问题描述

1 个解决方案

解决方案1 0 2014-08-22 00:36:15

解决方案1
0 2014-08-22 00:36:15