Полезные плагины для сайта на jQuery
31.07.2019
Полезные плагины для сайта на jQuery
Галереи, параллакс, меню и всплывающие уведомления — обзор проверенных jQuery-плагинов.
Галереи, параллакс, меню и всплывающие уведомления — обзор проверенных jQuery-плагинов.
В статье про jQuery мы сказали: плюс jQuery в том, что для этой библиотеки есть плагины на любой случай. Настало время это доказать — дарим вам подборку классных и проверенных плагинов на все случаи жизни.
1. Slideout.js
slideout.js.org
Этот плагин упрощает разработку мобильных веб-приложений и добавляет поддержку свайпа влево для доступа к меню. На сайтах тоже можно использовать, если хотите сделать мобильную версию максимально похожей на программу.
Отдельное спасибо разработчикам за то, что этот плагин весит всего 2 килобайта и не требует никаких дополнительных надстроек.
2. PhotoSwipe
photoswipe.com
Нужна красивая галерея на сайт? Ставьте PhotoSwipe — проверенную галерею с анимацией, множеством настроек и активным сообществом.
Подойдёт, если вам нужно просто красиво разместить фото на сайте, чтобы их можно было листать, разворачивать на весь экран и начинать просмотр с любой картинки.
3. Toastr
codeseven.github.io/toastr/
Плагин для уведомлений на все случаи жизни. Настраивать можно всё — от текста сообщения до анимации появления и длительности показа. Можно на своём сайте делать вид, что кто-то только что заказал ваш продукт из Будапешта, а кто-то другой только что просматривал эту страницу и тоже хотел купить. Всех такие всплывашки бесят, но они работают.
4. SweetAlert
sweetalert.js.org
Меняет стандартные браузерные уведомления на стильные и заметные сообщения. Теперь пропустить их будет сложнее, а пользователь сразу поймёт, что он него что-то хотят. Чтобы понять, как это работает, сравните два уведомления: стандартное и SweetAlert:
Стандартное SweetAlert5. jQuery-Tabledit
markcell.github.io/jquery-tabledit
Плагин для тех, кто работает с базами данных.
Например, если вы делаете админку для корпоративного сайта или веб-интерфейс для таблиц, то плагин поможет вам работать с полями таблицы как с обычными полями ввода. Можно разрешить только просмотр, изменение, удаление или всё вместе. Программисту остаётся настроить плагин так, чтобы все изменения попадали обратно в базу.
6. Skrollr
prinzhorn.github.io/skrollr
Лёгкий способ сделать эффект параллакса на странице — использовать Skrollr. Параллакс в общем случае — это когда что-то движется на переднем фоне быстрее, чем на заднем или на остальных. Эдакое псевдо-3D, только при скролле. Параллакс любят использовать производители смартфонов на заставках, а с этим плагином можно сделать в таком стиле целый сайт.
7. IntroJS
introjs.com
Удобная штука для создания обучающих сайтов или пошаговых руководств. Она поэтапно покажет все элементы на странице и объяснит, что они означают. Если нужно сделать онлайн-презентацию для заказчика и нет времени объяснять — берите IntroJS.
8. ScrollMagic
scrollmagic.io
Хитрый плагин с огромными возможностями настроек. Он закрепляет какой-то элемент страницы в определённом месте и включает анимацию в нужный момент. Нужный момент выбираете вы сами, и их может быть несколько на одной странице. Посмотрите пример, и вам станет понятно, насколько крут этот плагин.
9. FloatLabel.js
labs.mikemitchell.co.uk/FloatLabelJS/
Простой, но удобный плагин: он работает с полями ввода и следит за тем, когда вы начнёте туда что-то вводить. Как только начнёте — он делает из названия поля мини-заголовок и помещает его наверх:
10. jQuery GoUp!
dnlnrs.github.io/jquery-goup/
Самый простой плагин в обзоре. Кнопка просто возвращает вас наверх, в самое начало страницы. Когда лень скроллить.
Плагин отнесен в категорию jquery
Enable jQuery Migrate Helper
(106 общий рейтинг)
Собирает информацию об использовании устаревших возможностей jQuery в плагинах и темах.
The WordPress Team 100 000+ активных установок Протестирован с 6.0.3 Обновлен 11 месяцев назад
WP Featherlight — A Simple jQuery Lightbox
(94 общий рейтинг)
Ультра легкий jQuery lightbox для WordPress изображений и галерей.
Cipher 70 000+ активных установок Протестирован с 5.6.0 Обновлен 2 года назад
FancyBox for WordPress
Легко интегрирует лайтбокс FancyBox в ваш блог WordPress: загрузите, активируйте и готово. Дополнительная конфигурация необязательна.
Colorlib 60 000+ активных установок Протестирован с 6.0.3 Обновлен 11 месяцев назад
WP jQuery Lightbox
(36 общий рейтинг)
Универсальная замена Lightbox 2 и аналогичных плагинов, избавляющаяся от основной части Prototype и Scriptaculous.
Ulf Benjaminsson 50 000+ активных установок Протестирован с 6.0.3 Обновлен 8 месяцев назад
Animate It!
(126 общий рейтинг)
Добавьте к своему контенту классную анимацию CSS3.
eLEOPARD Design Studios 40 000+ активных установок Протестирован с 6.1.1 Обновлен 1 месяц назад
jQuery Updater
(61 общий рейтинг)
Этот плагин обновляет jQuery до последней стабильной версии.
Ramoonus 40 000+ активных установок Протестирован с 6.2 Обновлен 3 недели назад
jQuery Colorbox
Adds Colorbox/Lightbox functionality to images, grouped by post or page. Works for WordPress and NextGEN…
Arne Franken 30 000+ активных установок Протестирован с 5.
1.15
Обновлен 8 месяцев назадИспользовать библиотеки Google
(46 общий рейтинг)
Позволяет вашему сайту использовать стандартные javascript-библиотеки из Google’s AJAX Libraries CDN, вместо того, чтобы задействовать…
Jason Penney 20 000+ активных установок Протестирован с 4.7.25 Обновлен 6 лет назад
Meteor Slides
Easily create responsive slideshows with WordPress that are mobile friendly and simple to customize.
Josh Leuze 20 000+ активных установок Протестирован с 6.1.1 Обновлен 3 месяца назад
Scroll To Top
(12 общий рейтинг)
Автоматически добавляет удобную для применения кнопку «Вернуться наверх» на ваш сайт WordPress, которая позволяет посетителю…
Ga Satrya 20 000+ активных установок Протестирован с 6.
Scroll Back To Top
(56 общий рейтинг)
This plugin will add a button that allows users to scroll smoothly to the top…
Joe Sexton 10 000+ активных установок Протестирован с 4.2.34 Обновлен 8 лет назад
Dynamic «To Top» Plugin
(58 общий рейтинг)
Добавляет автоматическую и динамическую кнопку «Наверх» для прокрутки длинных страниц вверх.
Matt Varone, Tim Berneman 10 000+ активных установок Протестирован с 5.3.14 Обновлен 3 года назад
jQuery Manager for WordPress
Manage jQuery and jQuery Migrate, activate a specific jQuery and/or jQuery Migrate version. The ultimate…
Remzi Cavdar 10 000+ активных установок Протестирован с 5.
5.11
Обновлен 3 года назадjQuery Lightbox For Native Galleries
(10 общий рейтинг)
Makes the native WordPress galleries use a lightbox script called ColorBox to display the fullsize…
Viper007Bond 10 000+ активных установок Протестирован с 3.4.2 Обновлен 11 лет назад
Pojo Lightbox
This plugin used to add the lightbox (overlay) effect to all images on your WordPress…
Pojo Team 9 000+ активных установок Протестирован с 6.1.1 Обновлен 5 месяцев назад
Responsive Image Maps
(64 общий рейтинг)
Makes image maps responsive by packaging the RWD Image Maps jQuery plugin for use in…
Philip Newcomer 6 000+ активных установок Протестирован с 4.1.37 Обновлен 8 лет назад
WP-Slimbox2 Plugin
A WordPress implementation of the Slimbox2 javascript.
Greg Yingling (malcalevak) 5 000+ активных установок Обновлен 10 лет назад
Version Control for jQuery
(6 общий рейтинг)
Version Control for jQuery is one of the easiest ways to control the version of…
Leander Iversen 4 000+ активных установок Протестирован с 6.2 Обновлен 7 дней назад
Test jQuery Updates
(6 общий рейтинг)
Протестируйте разные версии jQuery и jQuery UI.
The WordPress Team 4 000+ активных установок Протестирован с 5.6.10 Обновлен 2 года назад
JS Archive List Widget
(43 общий рейтинг)
A JS widget (can be used in posts) for displaying an archive list with some…
Miguel Angel Useche Castro 4 000+ активных установок Протестирован с 6.
0.3
Обновлен 10 месяцев назад3000+ лучших плагинов jQuery с демонстрацией и примерами
10 ноября 2020 г. | Plugins, Responsive, Tabs
Skeletabs – это открытый
Подробнее Демонстрация
10 ноября 2020 г. | Формы, Плагины
jbvalidator — это новый плагин проверки формы на основе jQuery, созданный для последней версии Bootstrap 5 и поддерживающий проверку как на стороне клиента, так и на стороне сервера.
- Несколько языков.
- Пользовательские сообщения об ошибках.
- Пользовательские правила проверки.
- Простота использования с помощью атрибута данных HTML.
Подробнее Демонстрация
9 ноября 2020 г. | Плагины
Cuttr — это простая в использовании библиотека JS/jQuery с нулевой зависимостью, которая обрезает многострочный текст (Line Clampin’), чтобы он соответствовал заданным спецификациям. Он добавляет конечную строку, например многоточие (…), чтобы указать, что доступно больше текста, чем видно в данный момент.
Подробнее Демонстрация
25 июля 2020 г. | Плагины
ToxinRangeSlider
Подробнее Демонстрация
23 июля 2020 г. | Меню, Плагины
HC Off-canvas nav — это подключаемый модуль jQuery для создания переключаемых многоуровневых навигаций вне холста, позволяющий бесконечно вкладывать элементы подменю.
Подробнее Демонстрация
17 июля 2020 г. | Bootstrap, Карусель, Плагины, Премиум
Advanced Bootstrap Carousel Plugin может стать вашим следующим универсальным пунктом назначения.
Если доступна расширенная карусель Bootstrap со 138 готовыми макетами, вам не нужно использовать какой-либо другой фреймворк. Взгляните на наши проекты с расширенными функциями, с которыми вы никогда не сталкивались. Это может оказаться спасением для пользователей Bootstrap. Advanced Bootstrap Carousel Plugin — это чистый, инновационный, современный и элегантный плагин Bootstrap Slider, который поможет вам отображать ваш контент самым стильным образом. Независимо от того, ищете ли вы полную ширину, Cover Flow, Hero Scene или даже пост-слайдер, Advanced Bootstrap Plugin позволит вам художественно рассказать свои истории.
Подробнее Демонстрация
17 июля 2020 г. | Другие API, плагины, видео и аудио
YouRam Simple создает красивую галерею видео YouTube из любых загрузок канала или ссылки на плейлист. Видео отображаются во всплывающем окне или в виде вставки.
Подробнее Демонстрация
25 апреля 2020 г. | Другой API, Плагины, Премиум
Плагин поддержки социального чата, который обеспечивает быстрый и простой способ взаимодействия с вашими клиентами.
Этот плагин jQuery позволит вашим клиентам напрямую связываться с вашей службой поддержки.
Помимо поддержки вашего веб-сайта, вы можете поддерживать учетные записи Whatsapp, Messenger, Skype, Twitter, Telegram, Instagram и других.
Подробнее Демонстрация
11 февраля 2020 г. | CSS2 / CSS3.0, HTML5, плагины
ChatPro — чат «все в одном» на любой социальной платформе Плагин jQuery — это современный адаптивный плагин для чата, созданный с использованием HTML, JS и CSS3.
- Плагин поддержки чата, который обеспечивает быстрый и простой способ взаимодействия с вашими клиентами.
- JS, HTML5, CSS3, Bootstrap используется для разработки виджета чата хостинга.
- Все коды чисты и хорошо организованы. Вы можете легко редактировать/изменять/настраивать любой стиль.
- Эти плагины чата имеют 10 уникальных дизайнов и 8 цветовых комбинаций.
Подробнее Демонстрация
22 октября 2019 г. | Core Java Script, Plugins
wRunner — это плагин, добавляющий ползунок (слайдер) для выбора значения.
В плагине есть возможность задавать темы, шаг, минимальное и максимальное значения и т.д. Он бывает двух видов — одиночный и диапазонный, а также вертикальное и горизонтальное положение. Имеет две реализации — на чистом JS и на основе jQuery.
Подробнее Демо
Плагины jQuery, Учебники по jQuery, Статьи по jQuery, Примеры jQuery, Демонстрации jQuery
Карусель с перетаскиванием и колесом
17 февраля 2023 г. 603 Слайдер Карусель
Уникальная карусель изображений с интуитивно понятным перетаскиванием и плавной навигацией с помощью колесика мыши.
Читать далее »
ScrollyVideo.js — Адаптивные прокручиваемые видео
14 февраля 2023 г. 441 Прокрутить СМИ
ScrollyVideo.js — это отзывчивое прокручиваемое видео без неясных требований к кодированию видео. Совместимость с React, Svelte, Vue и простым HTML.
Читать дальше »
Анимация перетасовки типографики
09 февраля 2023 г.
408
Последствия
Анимация
Текст и строка
Учебное пособие по созданию анимации типа перетасовки с различными эффектами для гиковского вида терминала.
Подробнее »
Создание доступного средства выбора тем с помощью HTML, CSS и JavaScript
15 января 2023 г. 460
Руководство по использованию HTML, CSS и ванильного JavaScript для добавления доступного компонента выбора темы на веб-сайт.
Читать дальше »
GrapesJS — бесплатная среда разработки веб-сайтов с открытым исходным кодом
15 декабря 2022 г. 912 Элементы формы Перетаскивания
GrapesJS — это многоцелевая платформа Web Builder с открытым исходным кодом, которая сочетает в себе различные инструменты и функции с целью помочь пользователям создавать HTML-шаблоны без каких-либо знаний в области кодирования.
GrapesJS — это инструмент нового поколения для создания шаблонов без программирования.
Подробнее »
Lenis — библиотека Smooth Scroll с открытым исходным кодом
14 ноября 2022 1027 Прокрутить
Lenis – это библиотека с открытым исходным кодом, созданная для стандартизации процессов прокрутки и улучшения веб-сайтов с плавной навигацией при использовании платформы и сохранении ее доступности.
Подробнее »
MongoDB — Платформа данных
07 ноября 2022 г. 352
Если вы работаете в сфере разработки, возможно, вы слышали о MongoDB — на самом деле, вы даже можете быть активным пользователем. Согласно статистике WebTechSurvey, MongoDB используют более 17,906 веб-сайтов, заняв седьмое место на рынке среди тысяч поставщиков баз данных. Более того, MongoDB занимает второе место в опросе самых востребованных навыков работы с базами данных: 17,89% заявили, что не разрабатывают с ней, но хотят. Тем не менее, мы углубимся в то, что такое MongoDB и почему она стала популярной за последнее десятилетие.
Подробнее »
Переключатель анимации и просмотра при прокрутке
09 октября 2022 г. 989 Прокрутить Анимация
Учебник по созданию макета с некоторыми анимациями прокрутки и переключателем вида, где изображения элементов содержимого анимируются в сетку.
Читать далее »
02 октября 2022 г. 688 Меню Отзывчивый
menu-aim — это плагин jQuery для создания адаптивных мега-выпадающих списков, таких как Amazon .
Подробнее »
Tesseract.js — Чистый Javascript OCR для многих языков
01 октября 2022 г. 538
Tesseract.js — это чисто Javascript-порт популярного движка Tesseract OCR.
Подробнее »
Анимация макета меню в сетке
22 сентября 2022 г. 453 Меню Последствия Анимация
Простая анимация макета, в которой миниатюры строки меню анимируются в соответствии со своим положением в сетке предварительного просмотра содержимого с помощью Плагин GSAP Flip .