Search

Romua1d.ru
Скрипты

Более 70 плагинов jQuery скроллинга для вашего сайта

Представляю огромный список плагинов прокрутки на jQuery для вашего сайта.  Различные трюки с прокруткой пришли к нам из-за рубежа не так давно и оцепили ряд современных порталов и сайтов, которые хотели выделиться. Работа над вертикальной прокруткой вполне может повысить конверсию и несомненно впечатление пользователя. Благодаря интересным подходам JS + CSS3 Вы можете улучшить интерфейс своего сайта. Если добавить немного фантазии, то можно из любого плагина получить что-то уникальное для своего сайта. Ведь каждый сайт старается выделиться из серой массы разными способами. Благодаря прокрутке, можно некоторые страницы перенести на страницу, с реализованным плагином, что улучшит получение важной информации пользователем. Данная технология лучше всего подойдет для различных портфолио или же демонстрации какого-либо продукта и т.д.

Переходим непосредственно к делу.

к содержанию ↑

Sly

Sly — это библиотека JavaScript для расширенной однонаправленной прокрутки с поддержкой навигации по элементам. Его можно использовать как простую замену прокрутки, так и инструмент навигации, или как отличный интерфейс навигации и анимации для сайтов параллакса.

к содержанию ↑

jQuery Scroll Path

Это плагин для определения пользовательских путей прокрутки.

к содержанию ↑

windows

Удобный, слабо связанный плагин jQuery для полноэкранных прокручивающих окон.

к содержанию ↑

AnimateScroll

AnimateScroll — это плагин jQuery, который позволяет вам прокручивать на любую часть страницы, просто вызывая функцию animatescroll () с идентификатором или классом элемента, на который вы хотите перейти.

к содержанию ↑

ScrollMe

По мере прокрутки страницы ScrollMe может масштабировать, поворачивать, переводить и изменять прозрачность элементов на странице. Его легко настроить, и не требуется ни одна строка javascript.

к содержанию ↑

stickUp

Простой плагин, который «прикрепляет» элемент к верхней части окна браузера, прокручивая его, всегда сохраняя его в поле зрения. Этот плагин работает на многостраничных сайтах, но имеет дополнительные возможности для макетов с одним пейджером.

к содержанию ↑

Block Scroll

Block Scroll — это плагин jQuery, который превращает набор элементов в блоки и отображает их по одному экрану за раз. Идея состоит в том, чтобы разбить вашу страницу на куски для лучшего представления и потока пользователей. Блокировка прокрутки автоматически изменяет вашу страницу.

к содержанию ↑

Starscroll

Создайте div в качестве фона … активируйте плагин; анимация при прокрутке. Плагин автоматически установит div, чтобы он работал невидимым.

к содержанию ↑

Scrolldeck

Плагин jQuery для создания прокручивающих презентационных колод

к содержанию ↑

Scrollocue

Scrollocue — это плагин jQuery для создания простой системы autocue / teleprompter для прокрутки строк текста.

к содержанию ↑

scrollorama

Плагин jQuery для создания классных прокручиваемых материалов.

к содержанию ↑

Stellar.js

Stellar.js — это плагин jQuery, который обеспечивает эффекты прокрутки параллакса для любого элемента прокрутки.

к содержанию ↑

Super scroll orama

Плагин jQuery для анимации прокрутки supercool.

к содержанию ↑

Parallax

Экспериментальный легкий JS-скрипт для облегчения быстрой анимации на основе прокрутки.

к содержанию ↑

Responsive 3d Fold Scroll

Отзывчивая анимация 3D Fold на прокрутке плагина jQuery.

к содержанию ↑

jQuery Scrollify

Плагин jQuery, который помогает прокручивать и привязывать к разделам. Совместим с Touch.

к содержанию ↑

vivus.js

Vivus — это легкий класс JavaScript (без зависимостей), который позволяет вам анимировать SVG, давая им возможность рисования.

к содержанию ↑

jQuery slimScroll

slimScroll — небольшой (4.6KB) плагин jQuery, который преобразует любой div в прокручиваемую область с красивой полосой прокрутки.

к содержанию ↑

jQRangeSlider

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

к содержанию ↑

jQuery.pin

Вы когда-нибудь хотели прикрепить что-то к стороне текста? Вам когда-нибудь был нужен тонкий липкий элемент, который бы спокойно был закреплен, пока вы прокручиваете вниз?

jQuery.Pin здесь, чтобы помочь! Вставьте любой элемент в верхнюю часть контейнера. Легко отключите его для меньших размеров экрана, где нет места для такого рода махинаций.

к содержанию ↑

Infinite AJAX Scroll

Оптимизированный для SEO бесконечный плагин прокрутки для jQuery.

к содержанию ↑

Overscroll

Overscroll — это плагин jQuery и polyfill для стиля прокрутки Safari mobile. Он предназначен для использования в настольных браузерах с последней версией jQuery.

к содержанию ↑

jQuery.localScroll

Упрощенная якорная анимация.

к содержанию ↑

Parallax ImageScroll – jQuery plugin

JQuery и совместимый с amd плагин для создания эффекта параллакса, как показано на сайте spotify.com.

к содержанию ↑

fullPage.js

Легкий и простой в использовании плагин для создания полноэкранных прокручивающихся веб-сайтов (также известных как веб-сайты одной страницы, landing page), также можно добавлять некоторые горизонтальные слайдеры внутри разделов сайта.

к содержанию ↑

Parallax.js

Библиотека для Javascript, которая позволяет легко параллаксировать страницы.

к содержанию ↑

Jarallax

Jarallax — это библиотека JavaScript с открытым исходным кодом, которая упрощает настройку css на основе взаимодействия. С Jarallax легко создать веб-сайт с прокруткой параллаксом

к содержанию ↑

jInvertScroll

Это легкий плагин для jQuery, который позволяет вам перемещаться по горизонтали с эффектом параллакса при прокрутке вниз.

к содержанию ↑

Jquery fullContent.js

JQuery Full Content позволяет полностью создавать веб-сайты.

к содержанию ↑

jQuery One Page Scroll

Создайте веб-сайт со скроллингом на одной странице (веб-сайт iPhone 5S) с плагином прокрутки одной страницы.

к содержанию ↑

jQuery Parallax Plugin

jQuery Parallax — это сценарий, который имитирует эффект параллакса, как показано на nikebetterworld.com.

к содержанию ↑

jquery.parallax.js

Плагин parallax jQuery.

к содержанию ↑

jquery.arbitrary-anchor.js

Произвольные привязки для любого элемента на вашей странице, используя небольшую магию jQuery.

к содержанию ↑

Portfoliojs

Portfoliojs — это легкий плагин галереи jQuery для ваших красивых изображений с горизонтальной прокруткой, который поддерживает настольные, планшетные и мобильные браузеры.

к содержанию ↑

Scrolling Parallax Plugin

Scrolling Parallax — новый плагин jQuery, который связывает эффект параллакса с полосами прокрутки и колесиком мыши. Это позволяет фоновому изображению или чему-либо еще прокручиваться в разном темпе, чем веб-страница, когда пользователь прокручивает. Эффект параллакса, который является результатом, — это простой способ создать иллюзию глубины на вашем веб-сайте.

к содержанию ↑

Scrolltab

Плагин jQuery для добавления вкладок, визуально связанных с их положением относительно полосы прокрутки.

к содержанию ↑

Scrolly

Супер легкий и простой в использовании плагин parallax для jQuery.

к содержанию ↑

skrollr

Отдельная библиотека прокрутки параллакса для мобильных устройств (Android + iOS) и пк. Нет jQuery. Просто обычный JavaScript (и некоторая магия).

к содержанию ↑

SMINT

Smint — это простой плагин jQuery, который помогает при навигации на веб-сайтах с одной страницей.

к содержанию ↑

jQuery custom content scroller

Детально настраиваемый пользовательский плагин jQuery для прокрутки. Особенности включают в себя вертикальную и / или горизонтальную полосу прокрутки, настраиваемый импульс прокрутки, колесо мыши (через плагин jQuery mousewheel), поддержку клавиатуры и сенсорного экрана, готовые к использованию темы и настройку с помощью CSS, поддержку направления RTL, параметры опций для полного управление функциями прокрутки, методы запуска таких действий, как прокрутка, обновление, уничтожение и т. д.

к содержанию ↑

ScrollUpBar Plugin

Плагин прокрутки вверх (jQuery) скрывает верхнюю панель при прокрутке вниз и показывает ее при прокрутке вверх. Это особенно полезно на мобильных интерфейсах, чтобы сэкономить драгоценное пространство.

к содержанию ↑

StickyTableHeaders

Плагин jQuery, который делает большие таблицы более удобными, если заголовок таблицы будет прикреплен к верхней части экрана при прокрутке.

к содержанию ↑

jQuery panelSnap

Плагин jQuery, который обеспечивает функциональность привязки к набору панелей в вашем интерфейсе.

к содержанию ↑

isInViewport.js

Сверхлегкий плагин jQuery, который сообщает вам, есть ли элемент в окне просмотра с завихрением.

к содержанию ↑

Waterfall

Плагин jquery waterfall, такой как Pinterest, huaban.com, faxianla.com

к содержанию ↑

Scroller

Плагин jQuery для замены в браузерах прокрутки по умолчанию.

к содержанию ↑

jQuery.SerialScroll

Анимированная прокрутка серии.

к содержанию ↑

jScroll

jScroll — это плагин jQuery для бесконечной прокрутки, написанный Филиппом Клаузинским. Бесконечная прокрутка; также известная как ленивая загрузка, бесконечная прокрутка, автопир, бесконечные страницы и т. д.

к содержанию ↑

FoldScroll

Экспериментальный плагин jQuery для прокрутки CSS 3D.

к содержанию ↑

scrollUp jQuery plugin

ScrollUp — это легкий плагин jQuery для создания настраиваемой функции «Прокрутка вверх», которая будет работать с любым веб-сайтом с легкостью.

к содержанию ↑

multiScroll.js

Создавайте разделенные страницы с двумя вертикальными панелями прокрутки. Совместимость с мобильными телефонами и устройствами и старыми баузерами, такими как IE 8.

к содержанию ↑

Any List Scroller

jQuery scrolling plugin by musings.it для прокрутки любого списка с любым контентом.

к содержанию ↑

qpScroll

qpScroll — это плагин jQuery, который создает фон параллакса для любой страницы или div. Его очень легко настроить. Он может быть добавлен на любую существующую страницу без необходимости изменения маркировки HTML.

к содержанию ↑

jQuery Stick ’em

Сделайте контент липким в прокрутке, в точку.

Parallax.js

Parallax Engine реагирует на ориентацию смарт-устройства. Там, где нет оборудования для обнаружения гироскопа или обнаружения движения, вместо этого используется позиция курсора.

к содержанию ↑

Slinky.js

Slinky.js — это плагин jQuery для создания красивых списков навигации для прокрутки с заголовками штабелирования.

к содержанию ↑

Infinity.js

Infinity.js — это UITableView для Интернета: он ускоряет прокрутку по длинным спискам и сохраняет ваши бесконечные каналы бесперебойными и стабильными для ваших пользователей. Он небольшой, проверенный временем и высокоэффективный.

к содержанию ↑

Arbitrary Anchor

Этот плагин позволяет странице прокручивать любой произвольный объект на странице на основе селектора jQuery / CSS.

к содержанию ↑

Waypoints

Waypoints — это библиотека, которая упрощает выполнение функции всякий раз, когда вы переходите к элементу.

к содержанию ↑

jQuery.kinetic

Добавьте функциональность кинетической прокрутки в контейнер с помощью мыши или сенсорных устройств.

к содержанию ↑

Scrolling Progress Bar

Есть два компонента этого эффекта. Содержание и бары. Каждый раздел содержимого имеет идентификатор, который помогает вычислять процент. Каждый бар имеет ссылку, чтобы сгладить прокрутку к этому разделу.

к содержанию ↑

jQuery Smooth Div Scroll

Smooth Div Scroll — это плагин jQuery, который прокручивает содержимое по горизонтали влево или вправо.

к содержанию ↑

jQuery Story Tale

CSS 3 Анимация запускается в прокрутке, но с твистом истории.

к содержанию ↑

pagePiling.js

pagePiling  — плагин от Alvaro Trigo. Создайте прокрутку огромного числа разделов.

к содержанию ↑

AnimateScrollNavigation.js

Простой плагин jQuery, расширяющий плагин animateScroll с возможностями одиночной страницы.

к содержанию ↑

jQuery Animation Scroll Plugin

Мобильный дружественный viewport активирует анимацию jQuery Plugin, используя greensock.

к содержанию ↑

jQuery.ScrollTo

Простая прокрутка элементов с помощью jQuery.

к содержанию ↑

perfect-scrollbar

Крошечный, но совершенный плагин прокрутки jQuery

к содержанию ↑

Smooth Scroll Plugin

Автоматически проецирует одинаковые ссылки на страницы.

к содержанию ↑

Endless Scroll jQuery Plugin

Бесконечная прокрутка (или infinite scrolling) является популярным методом среди веб-сайтов 2.0, таких как Google Reader и Live Image Search, где вместо подкачки через элементы, используя традиционную технику разбиения на страницы, страница просто продолжает загружать новые элементы, прикрепленные к концу.

Плагин рейтинга создан автором этого блога. Буду очень признателен, если вы сможете его поддержать (ссылка)

p.s. Если статья была полезной и вас переполняет чувство благодарности, можете поддержать меня долларом на патреоне

Romuald Shmidtelson

Web Developer. I have expirience in FrontEnd, Backend, Devops. PHP, Python, Javascript (Vue.js, React.js)

Недавние Посты

Как получить первый заказ на фрилансе

Получение первого заказа на фрилансе может быть вызовом, особенно для новичков, которые еще не имеют…

1 год назад

Топ 7 css фреймворков 2021 года

Разработка сайтов и веб-приложений стала в наше время неизбежной потребностью. Тем не менее, существует несколько способов…

2 года назад

Что такое семантическое ядро и как его использовать для продвижения сайта?

Компании и специалисты по маркетингу тратят много времени и денег на изучение языка поисковых систем,…

2 года назад

Что такое адаптивные изображения? Как правильно использовать srcset.

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

3 года назад

Что такое Политика конфиденциальности для сайта и для чего она нужна?

Политика конфиденциальности - это документ, в котором подробно описывается, как компания или организация обрабатывает любую…

3 года назад

Кто такой вебмастер?

В современном мире много специалистов занятых поддержанием работы сайтов, и довольно часто многих из них…

3 года назад