В сегодняшнем посте мы представляем вам 10 демонстраций и плагинов jQuery для горизонтальной прокрутки, которые будут полезны тем, кто смотрит на вещи горизонтально. Я думаю, мы должны принять прокрутку некоторых людей в обе стороны! 🙂
Обновлено: март 2016 г. Обновлены все плагины и демоверсии с последними версиями и добавлены некоторые новые. Также удалены плагины, которые больше не находятся в разработке.
1. ScrollMagic
ScrollMagic помогает вам легко реагировать на текущую позицию прокрутки пользователя. Его легкий вес (6 КБ в сжатом состоянии) и мобильность. Он поддерживает оба направления прокрутки.
2. jInvertScroll
jInvertScroll — это легкий плагин для jQuery, который позволяет перемещаться по горизонтали с эффектом параллакса при прокрутке вниз.
3. Горизонтальная временная шкала
Из этого туториала вы узнаете, как создать простую в настройке горизонтальную временную шкалу на основе CSS и jQuery.
4. Плавная горизонтальная прокрутка с помощью jQuery
Из этого туториала вы узнаете, как создать простой эффект плавной прокрутки, используя плагин jQuery Easing и всего несколько строк jQuery.
5. просто прокрутка
simplyScroll — это гибкий jQuery-скроллер контента с поддержкой касания. Он автоматически поддерживает элементы неравного размера в режиме цикла.
6. Горизонтальная прокрутка с fullPage.js
fullPage.js — это плагин на основе jQuery, который позволяет нам создавать одностраничные веб-сайты с прокруткой. Он работает не только во всех современных браузерах, но и в некоторых старых, таких как IE 8 и Opera 12.
7. jQuery.kinetic
jQuery.kinetic — простой плагин, который добавляет плавную прокрутку перетаскиванием с постепенным замедлением для контейнеров.
8. Хитрый
Sly — это библиотека JavaScript для однонаправленной прокрутки с поддержкой навигации по элементам. Его можно использовать как простую замену полосы прокрутки, как расширенный инструмент навигации на основе элементов или как отличный интерфейс навигации и анимации для веб-сайтов параллакса.
9. pagePiling.js
pagePiling.js — это плагин jQuery, который помогает накапливать ваши разделы друг над другом и получать к ним доступ с помощью прокрутки или по URL. Он полностью совместим со старыми браузерами, такими как IE8 и Safari 12, а также отлично работает на мобильных устройствах.
10. Горизонтальная прокрутка Учебник
Этот урок научит вас прокручивать ваш веб-контент по вертикали, горизонтали и даже по диагонали! Не волнуйтесь, он не будет слишком сильно полагаться на JavaScript. Он использует CSS / HTML для макета и JavaScript только для прокрутки.
Вывод
В этой статье был рассмотрен список 10 наиболее часто используемых демоверсий и плагинов jQuery для горизонтальной прокрутки. Я надеюсь, что вы найдете их полезными для ваших проектов. Вы знаете другие плагины, которые могут помочь? Что ты используешь? Не стесняйтесь делиться своими мнениями и предложениями в комментариях ниже.