22 брилянтни jQuery приставки

За библиотеката jQuery са написани десетки хиляди jQuery плъгини. Създадена през 2006 г. от Джон Ресиг, библиотеката jQuery е една от най-популярните JavaScript библиотеки. Това е фантастичен ресурс за бързо проектиране и разработване на потребителски взаимодействия. Независимо дали става дума за галерия с изображения или форма, CSS анимация, разкриваща съдържание или ефект на експлозия, библиотеката предоставя основните градивни елементи, за да ви позволи бързо прототипиране и да предостави уникален потребителски интерфейс с минимален код и усилия.

Само защото можете да създадете свое собствено решение за даден проблем, означава ли това, че трябва? Разбира се, че не! Няма абсолютно никаква нужда да преоткривате колелото всеки път, когато искате да създадете малко обща функционалност; използвайте приставки за незабавно добавяне на поведение. Това ще ви спести още повече време и усилия. По-долу е нашият списък с полезни плъгини jQuery. Повечето също са безплатни.

За по-полезни ресурси за уеб дизайн, разгледайте нашия списък с най-добрите инструменти за уеб дизайн , най-добрите API на JavaScript и нашият избор на най-добрите рамки на JavaScript да обмисли.



01. Поддръжка на социален чат CZM

jquery плъгини

Добавете приставки за чат към вашия сайт лесно(Кредит за изображение: CzMMedia)
  • Изтеглете тук

Тази приставка за поддръжка на социален чат jquery ви позволява да добавите поддръжка за неограничени социални акаунти, включително Whatsapp, Messenger, Skype, Twitter, Telegram и Instagram. Лесно се настройва и можете да персонализирате бутоните, както желаете. За разлика от повечето приставки в този списък, той не е безплатен и ще ви струва $ 9 за изтегляне.

02. RTO + P видео плейър

jQuery плъгини: RTO + P Video Player

Направете свой собствен видео плейър, вместо да разчитате на вграждане в YouTube(Кредит за изображение: RTO + P)

Разбира се, лесно е да вградите видео от YouTube или от където и да е, но ако искате малко повече контрол върху вашето видео, тогава RTO + P Video Player е задължително. Улеснява изграждането и персонализирането на вашия собствен видео плейър, който получава видеоклипа си или от вашия собствен сървър или CDN, или от публичен поток Vimeo. Използвайте HTML маркера за видео, за да улесните живота или за по-добра производителност можете да използвате опцията за мързеливо зареждане.

03. Хлъзгав

jQuery плъгини: Slick

Каквато и въртележка да ви е необходима, направете я с Slick(Кредит на изображението: Кен Уилър)

Това ли е последната въртележка, от която някога ще се нуждаете? Със сигурност може да бъде; Slick е плъгин jQuery, който ви дава напълно отзивчиви въртележки от почти всеки вид, който бихте могли да пожелаете, с всякакви опции, с които да играете, включително мързеливо зареждане, автоматично пускане, обратно извикване и др.

04. Стената

jQuery плъгини: Стена

Гъвкавите оформления на Muuri са отзивчиви, сортируеми, филтрируеми и плъзгащи се

За най-добрата гъвкава подредба, Muuri на Niklas Rämö си заслужава да бъде разгледан. Неговата система за оформление ви позволява да позиционирате елементи от мрежа с различни размери в контейнер по почти всякакъв начин, който можете да си представите, и е отзивчив, сортируем, филтрируем и плъзгащ се. По подразбиране той ще подреди всичко по начин „по избор“, но можете да добавите свой собствен алгоритъм за оформление за различен стил на оформление.

05. Timeline.js

timeline.js

Хронологията прави точно това, което пише на калай, и създава плъзгач за времева линия

Тази приставка jQuery предлага обрат на компонента на въртележката: Timeline.js ви предоставя всичко необходимо за създаване на хронология на въртележката (т.е. плъзгач, който напредва въз основа на хронологични точки). Той включва много възможности за визуално и функционално персонализиране.

06. Наклонен превъртане на страницата

наклонено превъртане на страницата

Наклоненото превъртане на страницата добавя изискан 3D ефект към вашите страници

Този плъгин от Pete R. е отличен начин да привлечете вниманието на хората и да добавите малко повече дълбочина към вашия сайт. С неговото инсталиране елементите ще се наклонят в полезрението, докато превъртат страницата нагоре, и отново, когато се измъкнат от горната част на страницата. Това е страхотно изглеждащ ефект, който е приятен и лесен за изпълнение.

07. Фокус точка

плъгин за фокусна точка jquery

Кажете сбогом на зле подрязаните отзивчиви изображения

Страхотното при отзивчивия уеб дизайн е възможността да създадете една страница, която да изглежда добре на всяко устройство. Ако обаче вашият сайт автоматично изрязва изображения, за да се поберат в определени прозорци, той често може да загуби фокусната точка. С Focuspoint можете да се уверите, че вашето изображение изглежда страхотно във всеки контейнер, като посочите фокусна точка за всяко изображение и приставката ще изреже нежелани части преди важните битове.

08. SVGMagic

SVGMagic jquery плъгин

SVGMagic създава PNG, за да замени SVG, когато те не се поддържат

Използването на SVG изображения е добра идея, защото те ще изглеждат остри при всякакъв размер и този плъгин ви помага да направите това, без да се притеснявате за браузъри, които не ги поддържат. Той търси SVG изображения и ги замества с PNG версии, ако SVG не се поддържа.

09. Разпознаване на лица

Приставка за откриване на лица jQuery

Този плъгин осигурява лесен начин за използване на мощна технология

Открийте и вземете координатите на човешки лица в изображения, видеоклипове и платна с този плъгин, който е написан от Джей Салват и използва алгоритъма за разпознаване на лица на Лиу Лиу.

10. Кръгъл плъзгач

плъгин rounderslider jQuery

Плъзгачът може да бъде тематичен според вашите цели

Този кръгъл плъзгач дава възможност на потребителя да избере диапазон от стойности чрез мишката върху кръга. Пълният плъзгач е настройката по подразбиране, но можете да го използвате и за получаване на форми на четвърт, полукръг и пай. Има CSS стилове, които можете да настроите, за да го тематизирате по различни начини, например да изглежда като скоростомер. Не участват изображения; всичко е направено с CSS и JavaScript.

11. jInvertScroll

jinvertscroll jQuery плъгин

Получете ефект на паралакс с лекота

jInvertscroll улеснява прилагането на хоризонтално превъртане с ефект на паралакс. Завъртете колелото си за превъртане на техния демонстрационен сайт, за да свирите настрани, докато два слоя пейзаж се движат с различна скорост, за да създадете илюзия за дълбочина.

12. Сплинки

jQuery плъгини: Slinky

Дизайн на меню, който няма да излезе от мода?

Slinky е елегантен, вечен дизайн на менюто, който е полезен за всеки сценарий, в който имате много подменюта. Изберете елемент и анимация плъзга подменюто. Има демонстрация тук .

13. Двадесет и двадесет

jQuery плъгини: TwentyTwenty

Приставката на ZURB ви помага да сравнявате изображения

Вместо да поставяте две изображения едно до друго, за да покажете разликите между тях, можете да използвате този плъгин, който поставя едно върху друго. Потребителите плъзгат плъзгач, така че изображението отдолу да се показва, като им позволява да видят какво се е променило в ситуация преди и след.

14. Йерархичен дисплей на материалния дизайн

jQuery плъгини: йерархичен дисплей

Анимациите могат да помогнат за насочване на вниманието на потребителите

Йерархични анимационни ефекти на дисплея могат да се използват, за да насочат вниманието на потребителите и да ги водят от една точка до друга в процеса. Тази анимация може да бъде персонализирана така, че да отговаря на вашия дизайн и разполага със страхотна документация, която да ви помогне.

15. Tabslet

jQuery плъгини: Tablset

Минималистичен дизайн на раздела

Както подсказва името, Tabslet е лек плъгин за създаване на раздели. Той поддържа следващ / предишен контрол, ротация, персонализирани събития, дълбоки връзки и много други полезни функции. Погледни демото за да видите дали отговаря на вашите нужди.

16. наногалерия2

jQuery плъгин nanoGALLERY

Пълнофункционална, бърза галерия с изображения

nanogallery2 е предназначен да опрости вашите галерии с изображения и предлага навигация на много нива в албуми, лайтбокс, комбинируеми ефекти на мишката върху миниатюри, слайдшоу, цял екран, страниране и мързелив товар. Той е с възможност за докосване, отзивчив, бърз и поддържа облачно съхранение.

Версия 2 предлага подобрено потребителско изживяване и нови функции като филтриране по ключови думи, количка за пазаруване, споделяне в социални мрежи, усъвършенствани ефекти при нанасяне на курсора на мишката, преходи при показване на миниатюри, информационна страница с местоположение в Google Maps и др.

17. Tooltipster

jQuery плъгин Tooltipster

Фантастични подсказки с Tooltipster

Tooltipster е модерен подход към класическия подсказка, който ви позволява да представите изцяло HTML-активирани подсказки в семантична маркировка с CSS, използван за управление на дисплея. Има широк спектър от опции за конфигуриране, което го прави персонализиран за всеки сценарий.

18. Великолепно изскачане

jQuery плъгин Magnific Popup

Лека, ефективна лайтбокс

Това е лайтбокс плъгин за jQuery, който се фокусира върху това да бъде възможно най-лек и съвместим. Разработчикът се е концентрирал върху производителността и потребителския опит, така че няма всички функции на алтернативни плъгини за лайтбокс, но е супер бърз и работи перфектно в огромна гама от устройства, включително устройства с висок DPI (Retina), като MacBook Pro.

19. Копче jQuery

Копче за плъгин jQuery

Лесни за докосване циферблати, които работят и на работния плот

jQuery Knob приема входни елементи и ги преобразува в удобни за докосване циферблати, които също работят на работния плот. Това е отличен пример за това как можете да приспособите съдържанието си така, че да отговаря на новите парадигми и си струва да разгледате техническия подход, ако не друго.

20. Typeahead.js

jQuery плъгин Typeahead

Удобен инструмент за автоматично попълване, създаден от разработчиците на Twitter

Продуктът на екипа за разработка на Twitter, Type Ahead е лесен за изпълнение инструмент, който изтегля от локален или външен източник на данни, докато потребителят ви въвежда, в полето за въвеждане, предоставяйки предложения за автоматично попълване, докато вървят.

21. Надписване.js

jQuery плъгин надпис

Получете фин контрол върху вашия тип

Lettering.js осигурява подробен контрол върху отделни символи от вашия тип, което ви позволява да прилагате кернинг, да оцветявате отделни букви и да прилагате слушатели на събития. Той също така играе добре с FitText (по-долу), като ви дава контрол в стила на работния плот над вашата типография, като същевременно остава отзивчив.

22. FitText

jQuery плъгин FitText

Автоматично мащабирайте текста си за отзивчиви заглавия

Този удобен плъгин ви позволява да запълните ширината на контейнера с вашия тип, но автоматично да мащабирате размера на текста нагоре или надолу, за да отговарят. Проектиран да улесни отзивчивите заглавия, плъгинът също се интегрира с Lettering.js, за да даде възможност за гранулиран стил за всеки символ.

Свързани статии: