Перейдите к следующему классу 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, но он возвращает мне очень странные результаты.
Почему это не работает, как задумано?