Как сделать переход по записям на JS (prev/next)?

Question

[sz9]

Добрый вечер.

Как сделать переход по записям на JS?
У нас на странице есть N, идущие подряд друг под другом, количество записей. Есть панель с кнопками: Предыдущая/Следующая
При нажатии на Следующая->мы плавно переходим до записи 2, еще раз нажимаем на Следующая->запись 3.

При нажатии Предыдущая->на запись 2, и т.д. по смыслу.

jsfiddle.net/wz98A

Answer 1

[Алексей]

demos.flesler.com/jquery/scrollTo

Comments

[sz9]

прочитай еще раз, пожалуйста.
меня по ссылке ничего не натолкнуло на мысль

[Алексей]

Значит стоит учить js, вам что конкретно нужно, сразу весь код? Тогда лучше обратится на фриланс, за пару баксов вам все сделают.

[sz9]

я думал тут мне подскажут а не напишут весь код. по ссылке ничего для себя я не взял, просмотрев и прочитав все о ScrollTo. то что вы кинули - только чуточку коснулось моего дела. и то, это уже давно сделано

Answer 2

[Юрий Лобанов]

Как скроллить к определенному id вы знаете. Далее логика следующая:
В начале кнопка next ведет ко второму блоку, prev к первому. При нажатии на next увеличиваете значение счетчика на один, при prev - уменьшаете, но только если счетчик уже не равен 1. Значение можно запоминать в дата-атрибуты, и по этому значению формировать ссылку на которую надо скроллить. Для формирования ссылки или используйте id1, id2, id3 или считайте детей в блоке.
Если заранее известно количество блоков, то не забудьте поставить и верхнее ограничение на счетчик. Если не известно - то его надо получить, опять так - считая детей.
Код не пишу, думаю, что Вам самому будет интересно.

Answer 3

[Юрий Лобанов]

Еще учтите, что на тот случай, если пользователь будет скроллить без использования ваших кнопок, то необходимо отслеживать это и менять атрибуты на кнопках, иначе, если он проскроллит вниз и нажмет next, то попадет ко второму блоку, то есть поедет снизу вверх.

Comments

[sz9]

спасибо, это сделал. как мне определять скроллинг пользователя, если он не пользовался кнопками?

нужно брать координаты? если да - то придется считать координаты блоков - и не использовать ID

[Юрий Лобанов]

Нет, должен быть способ проще. Погуглите jquery-scrollspy.
https://github.com/thesmart/jquery-scrollspy

[Юрий Лобанов]

То есть идея такая: когда пользователь прокручивает до элемента id4, дата-атрибут должен принять значение 4.

[sz9]

ok, спасибо