Добавление прокрутки к следующему элементу с тем же классом в jQuery - PullRequest
Новая
       20

Добавление прокрутки к следующему элементу с тем же классом в jQuery

0 голосов
/ 29 августа 2018

Я пытаюсь добавить функциональность стрелки, при нажатии на которую прокручивается пользователь к следующему разделу с указанным классом. Каждый раздел будет иметь один и тот же класс и стрелку с классом для цели в jQuery. Поэтому у меня будет несколько разделов, настроенных так: 

<section class="homeSection">
   <div class="content">
     //Content goes here
   </div>
   <div class="btnContainer">
    <button class="arrow">Arrow</button>
   </div>
</section>

<section class="homeSection">
   <div class="content">
     //Content goes here
   </div>
   <div class="btnContainer">
    <button class="arrow">Arrow</button>
   </div>
</section>

<section class="homeSection">
   <div class="content">
     //Content goes here
   </div>
   <div class="btnContainer">
    <button class="arrow">Arrow</button>
   </div>
</section>

//And so on...

Таким образом, с этой настройкой будет создано около 5 секций с одинаковыми классами для секции и кнопки. То, что я пытаюсь сделать, это то, что при нажатии кнопки раздела она прокручивается до самого следующего раздела под ним, и этот цикл будет продолжаться до тех пор, пока вы не достигнете последнего раздела и конца страницы.

Сначала я настроил его так: 

    $(".downArrow--hero").click(function() {
    $('html, body').animate({
        scrollTop: $(".cardItems").offset().top
     }, 1000);
     });

И он будет нацелен на каждый раздел на основе уникального класса, но теперь мне нужно настроить его так, чтобы каждый раздел имел один и тот же класс. Какой мой лучший подход к этому?

...