Перейдите к следующему классу Div с помощью кнопки Next / Previous

То, что я хотел бы для фиксированной навигации, с кнопками NEXT и PREV, чтобы в основном прокрутить страницу до следующего div с классом "section".

Я настроил jQuery, чтобы по существу добавить функцию щелчка для ссылок NEXT и PREV. Эта функция щелчка затем будет использовать ScrollTop для перехода к следующему элементу с классом .section.

Вот jQuery:

$('div.section').first();
// binds a click event-handler to a elements whose class='display'
$('a.display').on('click', function(e) {
    // prevents the default action of the link
    e.preventDefault();
    // assigns the text of the clicked-link to a variable for comparison purposes
    var t = $(this).text(),
      that = $(this);
      console.log(that.next())    
      // checks if it was the 'next' link, and ensures there's a div to show after the currently-shown one
      if (t === 'next' && that.next('div.section').length > 0) {
      //Scroll Function
      $('html, body').animate({scrollTop:that.next('div.section').scrollTop()});
  } 
    // exactly the same as above, but checking that it's the 'prev' link
    else if (t === 'prev' && that.prev('div.section').length > 0) {
      //Scroll Function
       $('html, body').animate({scrollTop:that.prev('div.section').scrollTop()});     
  }
});

В настоящее время я работаю над JSfiddle с тщательно прокомментированным jQuery, чтобы помочь вам переварить:http://jsfiddle.net/ADsKH/1/

У меня есть console.log, в настоящее время проверяющий (that.next ()), чтобы определить, каким будет следующий .section, но он возвращает мне очень странные результаты.

Почему это не работает, как задумано?

Ответы на вопрос(1)

Ваш ответ на вопрос