MODx Украина » Бесконечная прокрутка на Ditto

Бесконечная прокрутка на Ditto (Перевод)

 

Чтобы настроить бесконечную прокрутку, вначале нужно убедиться что плагин бесконечной прокрутки(Infinite Scroll) работает правильно с ссылками которые генерирует Ditto. К сожалению плагин сам пытается угадать УРЛ следующей страницы, но с Ditto это работает не так как хотелось бы. Я должен взять последнюю версию IS и прилагающийся код.

Я поставил модифицированную версию с github. Что бы заставить все работать достаточно файлов jquery.infinitescroll.min.js и ajax-loader.gif.

Пряма ссылка на на файлы — jquery.infinitescroll.min.js и ajax-loader.gif

Настройка jQuery сниппета

Загрузите 2 обязательных файла jquery.infinitescroll.min.js и ajax-loader.gif в папку assets/templates/site/infinitescroll.

Настройка Ditto чанка

Создайте новый чанк с именем «Article» и скопируйте туда код:
Просмотреть код

Шаблон

Я подумал, будет проще скопировать сюда тестовый шаблон, который использует необходимый код. Это модифицированная версия тестового шаблона, что используется в ДЕМО. Надеюсь, мои комментарии придают смысл коду.

Это ВАЖНО что вы не кешируете шаблон, но вызов Ditto - кэшируемый.


Просмотреть код

Демо


Примечание:

  1. В настоящий момент это не работает на iPhone(проблемно iPads), но вы всегда можете нажать «Далее».
  2. Я тестировал плагин только в конкретных условиях. Вы можете поиграться с настройками IS (Infinite Scroll). (на англ. было - Feel free to play)

Баги и предложения можете выкладывать прямо здесь в комментариях(по англ.). Спасибо!


Это перевод статьи Infinite scroll with Ditto с блога MODxRULES!.

Перевод подготовлен Даниилом Оросом для читателей MODx CMS - Блог о лучшей CMS.

   

Понравилась статья?

Тогда подпишитесь на:

  1. RSS-ленту
  2. Email рассылку
  3. Twitter ленту
  4. Facebook ленту или нашу Facebook страницу!

Также вас могут заинтересовать:


Комментариев
Комментарии работают на Disqus