Как сделать такую бесконечную прокрутку элементов списка, с неявным переходом в начало списка?

Question

[hdworker]

Господа, здравствуйте!
Подскажите пожалуйста, имеется вот такая галерея, скролл реализован довольно просто:
li в inline, максимальная width, overflow hidden, сдвиг по margin-left.
goo.gl/OKHiZx

Однако они там умудрились сделать так, что когда список прокручивается до конца, визуально листалка не прерывается, однако техничеки идёт сброс margin-left и переход на первый элемент списка. Как они так сделали?

Заранее спасибо за ответ!

Answer 1

[Сергей Вирченко]

здесь по 2 одинаковых слайда: prntscr.com/974cl1, т.е. 1ый список и сразу без перерыва повторяющийся 2ой. берется вся ширина слайдов и когда margin доходит до отметки всей ширины просто обнуляется margin, без плавности, поэтому незаметно происходит.
можешь это проверить убрав у .pageCollection .collectionContent overflow: hidden, слева будет заметно как это происходит

Answer 2

[_Performante_]

Может поможет habrahabr.ru/sandbox/57339

Comments

[hdworker]

Спасибо! В приведённом примере используется ajax, а у парней с того сайта всё в браузере, не могу понять как они так сделали.

Answer 3

[Dmitry Pavlov]

Последний элемент - прыгайте на первый без задержки

Вот вариант правда для вертикальной прокрутки:

$('document').ready(function() {
             $(document).scroll(function(){
             if(document.documentElement.clientHeight + 
             $(document).scrollTop() >= document.body.offsetHeight )$(document).scrollTop(0);
             });
          });

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