Если вкратце охарактеризовать то, что делает библиотека jQuery, то это прозвучит довольно обыденно: данная библиотека позволяет изменять содержимое HTML-документов путем манипулирования объектами модели, создаваемой браузерами в процессе обработки HTML-кода (так называемые DOM-манипуляции).
Вам, наверное, уже приходилось манипулировать объектами DOM (Document Object Model - объектная модель документа) с помощью других библиотек JavaScript или встроенных функций API (Application Programming Interface - интерфейс программирования приложений) , которые поддерживаются большинством современных браузеров. Однако библиотека jQuery работает намного лучше. Она превращает манипулирование объектами DOM в увлекательное занятие, временами напоминающее настоящее развлечение.
В работе с jQuery есть нечто настолько элегантное и притягательное, что задачи, решение которых обычно требует выполнения множества скучных рутинных операций, внезапно чрезвычайно упрощаются, так что, начав использовать jQuery, вы уже не сможете от этого отказаться. Что касается лично меня, то я использую jQuery в своих проектах по следующим причинам:
Средства jQuery необычайно выразительны. Эта библиотека позволяет добиться гораздо большего при намного меньшем объеме кода, чем в случае использования программных DOM-интерфейсов браузеров.
Методы jQuery применимы к целым группам элементов. Предлагаемый в DOM-модели стандартный подход, основанный на шаблонной цепочке действий "выбрать-повторить-изменить", больше не требуется. Следствием этого является уменьшение количества циклов for в коде, а значит, и снижение вероятности появления в нем ошибок.
Библиотека jQuery справляется с различиями в реализации DOM в различных браузерах (проблемы кросс-браузерности). Например, меня не должна беспокоить мысль об особенностях поддержки того или иного средства, чем печально славится браузер Internet Explorer (IE). Достаточно всего лишь сформулировать jQuery свои пожелания, и библиотека самостоятельно обеспечит совместимость с конкретным браузером.
Библиотека jQuery имеет открытый исходный код. Если принципы работы какого-либо средства для меня не совсем ясны или получаемый результат не совпадает с ожидаемым, я могу обратиться непосредственно к коду библиотеки на JavaScript и, если это необходимо, внести соответствующие изменения.
Здесь также рассматриваются библиотека jQuery UI - это набор инструментальных средств, который предназначен для создания универсальных пользовательских интерфейсов и может применяться на любых устройствах.
Описание библиотеки jQuery:- 1. Основы jQuery, работа с DOM-моделью
- Вставка дочерних, сестринских и родительских элементов
Последнее обновление: 1.11.2015
Что такое jQueryСовременное веб-программирование и создание веб-сайтов уже невозможно представить без использования языка JavaScript. Однако в настоящее время, все чаще используется не "голый" код javascript, а javascript-фреймворки и библиотеки. Одной из таких библиотек, причем наверное самой популярной на сегодняшний день, является jQuery. По некоторым оценкам не менее половины крупнейших сайтов в интернете используют эту библиотеку.
Хотя мы и можем назвать jQuery библиотекой, он на самом деле понятие "jQuery" объединяет целую экосистему библиотек, построенный вокруг базовой библиотеки: это и библиотека jquery.ui, предназначенная для создания визуальных интерфейсов, это и jqyery.mobile, используемая при разработке мобильных сайтов и др.
Какие преимущества несет нам использование jQuery?
Упрощение работы с кодом . jQuery предлагает простой элегантный синтаксис для манипулирования элементами на веб-странице.
Расширяемость . Весь код jQuery открыт для просмотра и изменения, и в случае, если что-то в библиотеке не устраивает, ее можно модифицировать. А также можно создавать плагины jQuery.
Кроссбраузерность . jQuery имеет поддержку большинства известных браузеров, в том числе таких. как IE 7,8. (Хотя в силу того, что браузеры IE 6-8 постепенно становятся достоянием истории, а также чтобы уменьшить размер библиотеки в последней версии была прекращена поддержка IE 6-8).
Чтобы начать работать с данной библиотекой, нам первым делом надо ее загрузить. Ее найти можно на официальном сайте разработчика https://jquery.com/download/ . На странице загрузок в самом можно найти несколько версий jQuery. На момент написания данной главы последней доступной версией является 2.0.3. Хотя версии немного отличаются друг от друга, но эти отличия, как правило, не столь существенны, и базовый стержень и общие принципы у большинства версий по сути одни и те же.
Библиотека представлена в двух вариантах - Compressed или Monified (минимизированная) и Uncompressed (обычный). Минимизированные версии предоставляют ту же функциональность, что и обычные, но отличаются тем, что не содержат всяких необязательных символов, наподобие пробелов, комментариев и т.д., и поэтому в своем названии имею суффикс min , например, jquery-1.10.1.min.js . Поскольку они производительнее за счет меньшего объема, их рекомендуется использовать в реальном производстве. В то же время, если вам захочется понять логику кода jQuery, то в этом случае можно обращаться к обычной версии библиотеки.
Библиотека jquery подключается также, как и другие файлы javascript. Например:
Мир jQuery
В данном случае я использовал минимизированную версию библиотеки jquery - jquery-1.10.1.min.js. Теперь создадим какую-нибудь простенькую веб-страничку с использованием jquery:
Мир jQuery Добро пожаловать в мир jQuery jQuery JavaScript $(function(){ $("#btn1").click(function(){ $(this).css("background-color", "red"); alert("Мир jQuery"); }); });
Данная веб-страница, с одной стороны, применяет код jquery, с другой стороны, также демонстрирует отличие от использования стандартного кода javascript.
У нас определены на странице две кнопки. У одной кнопки определен обработчик onclick в самой разметке кнопки: onclick="alert("Мир JavaScript"); " .
Другая же кнопка делает практически тоже самое, но только с jquery. Для этой кнопки определен id (id="btn1"), через который в функции jquery мы будет ею управлять.
В самом низу страницы мы определим функцию jquery:
$(function(){ $("#btn1").click(function(){ $(this).css("background-color", "red"); alert("Мир jQuery"); }); });
Выражение $(function(){}); - это и есть краткое определение функции jquery. Эту функцию принято помещать в конце документа, как в данном случае, перед закрывающем тегом body. Данная функция включает весь код на языке javascript, который будет выполняться при загрузке страницы.
Смысл использованного кода состоит в том, что мы получаем элемент кнопки в выражении $("#btn1") и затем вешаем на него обработчик нажатия. Фактически выражение $("#btn1").click будет аналогично использованию обработчика onclick в теле разметки кнопки. При этом нам не надо никак изменять разметку самой кнопки, что-то туда дописывать. Все делается в функции jquery.
Что в нашем случае она включает? Во-первых, мы устанавливаем цвет кнопки: $(this).css("background-color", "red"); . А дальше просто выводим сообщение на экран.
Использование сетей CDNВ предыдущем примере я подключил библиотеку jquery непосредственно с локального диска, однако нам необязательно загружать библиотеку и размещать на локальном диске рядом с прочими файлами. Вместо этого мы можем использовать сети CDN (Content Delivery Networks). В данном случае сама библиотека будет находится физически в какой-либо сети CDN, а мы можем указать на нее ссылку.
Например, подключим библиотеку jquery, находящуюся в jQuery CDN:
Мир jQuery
Необязательно подключать именно эту версию библиотеки, весь набор доступных версий библиотеки можно найти по адресу https://code.jquery.com/
Также мы можем использовать и другие сети CDN. Например:
Google CDN: предоставляется компанией Google. Все доступные версии можно найти по адресу https://developers.google.com/speed/libraries/devguide?hl=ru#jquery .
Microsoft CDN: предоставляется компанией Microsoft. Все доступные версии можно найти по адресу https://www.asp.net/ajaxlibrary/cdn.ashx#jQuery_Releases_on_the_CDN_0 .
Формат подключения будет следующим:
Yandex CDN: предоставляется российской компанией Yandex. Все доступные версии можно найти по адресу
JavaScript и jQuery
Что такое jQueryjQuery – это библиотека различных полезных программных сервисов для манипуляции элементами html разметки загруженной страницы. Написана она на . Прелесть ее не только в том, что она обладает достаточно серьезными возможностями, но и в том, что ее программный интерфейс прост до безобразия.
Перед тем, как перейти к описанию jQuery, еще раз напомню, что такое объектная модель документа или DOM (Document Object Mode l). DOM – это иерархическая структура объектов в оперативной памяти, соответствующая структуре загруженной интернет страницы. DOM формируется браузером и предоставляет программный интерфейс для работы с элементами разметки, например, с использованием того же JavaScript. Средствами DOM вы можете искать, добавлять и удалять элементы документа, редактировать их атрибуты, менять стили и т.д. Другими словами, с помощью DOM и JavaScript создаются динамические интернет страницы, которые еще называют DHTML страницам (Dynamic HTML pages). Вернемся к библиотеке jQuery. С помощью программного интерфейса jQuery вы легко можете выбрать нужные вам элементы DOM и выполнить с ними любые действия из нижеприведенного списка:
- Изменить ;
- Отредактировать атрибутный состав;
- Удалить;
- Добавить потомков;
- Переместить или обернуть другим элементом;
- Выполнить копирование;
- Привязать обработчик события;
- Настроить визуальный эффект или анимацию;
Для начала нужно скачать библиотеку. Сделать это можно на сайте авторов jQuery: http://jquery.com . Далее, необходимо ее просто подключить с помощью тега примерно так:
Все, можно начинать с ней работать. Если желания скачивать нет, то можно указать ссылку прямо на последнюю версию библиотеки, расположенную на сервере разработчика: Ссылаться на последнюю версию с одной стороны хорошо, поскольку в ней постоянно устраняют какие-то ошибки и оптимизируют работу отдельных ее функций, но, с другой стороны, в новой версии могут появиться изменения, которых вы не ожидаете, и которые приведут к изменениям в работе вашего проекта.
Программный интерфейс или синтаксис jQueryЯ уже сказал, что синтаксис запросов jQuery достаточно прост. Именно запросов, поскольку программирование на JavaScript с использованием jQuery можно отнести к декларативному программированию , которое отличается от классического процедурного программирование тем, что вы описывает “что нужно сделать”, а не “как сделать”. В названии библиотеки отражена ее суть – язык запросов в контексте JavaScript. Все запросы на jQuery начинаются вызовом функции $ , аргументом которой является сам запрос. Итак, обобщенный синтаксис jQuery запроса выглядит примерно так:
$(запрос
)[{.фильтр
(критерий
)}].действие
(аргументы
){ .действие
(аргументы
)}
Запрос
– это селектор или список селекторов, разделенных запятой. Синтаксис запроса совпадает с синтаксисом селекторов CSS стилей. Таким образом, запрос jQuery может начинаться примерно так:
$(“div”) - выбор всех элементов div
;
$(“div, p”) – выбор всех элементов div
и элементов p
;
$(“.class_name”) – выбор всех элементов класса class_name
;
$(“#element_id”) – выбор элемента с идентификатором element_id
;
$(*) – выбор вообще всех элементов;
$(“.class_name span”) – выбор всех элементов span в рамках всех элементов класса class_name
;
$(“#element_id > div”) – выбор всех элементов div
, являющихся прямыми потомками (дочерними элементами) элемента с идентификатором element_id
.
$(“#element_id .class_name + div”) – выбор всех элементов, которые следуют сразу за элементами класса class_name
в рамках элемента element_id
.
$(“#ul_id > li:first”) – выбор первого элемента li
списка ul_id
. Также, можно выбрать последний last элемент либо все четные even или нечетные odd элементы. Есть и другие варианты.
$(“a”) – выбор всех ссылок со значением атрибута href
, начинающегося на “http://ru.wikipedia.org”
. Без символа “^” получим условие на полное совпадение значений, если вместо символа “^” поставим символ “$”, то получим ограничение на совпадение с конца, а символ * будет означать, что значение атрибута должно просто содержать указанный фрагмент.
Фильтр
– способ отфильтровать набор выбранных элементов по дополнительным критериям. Критерии – это те же селекторы. Есть две противоположные друг другу операции: filter и not . Если использовать операцию filter(критерий)
, то выбранными останутся только те элементы, которые удовлетворяют аргументу - критерию, а если not
, то останутся только те, что не удовлетворяют. Обычно, смысл имеет использовать операцию not
, поскольку критерий операции filter
обычно легко объединить с основным селектором функции $()
. Вот пара примеров использования этих операций:
$(“div”).not(“.class_name”) – исключаем все div
класса class_name
;
$(“td, th, div”).filter(“.class_name”) – отбираем элементы td
, th
, div
класса class_name
.
Есть еще операция slice(from, to) , которая позволяет выделить последовательность элементов с индексами из промежутка [from - to ].
Действие
– это, собственно, само действие – некоторая операция над множеством выбранных элементов
. Каждая операция возвращает некий результат: либо то же самое множество, если операция не связана с созданием новых или удалением выбранных элементов, либо уже отредактированное множество, либо набор вновь созданных элементов. Благодаря этому вы можете указать сразу несколько операций, разделенных точками. Приведенный ниже пример выполнит отбор всех элементов span
, не относящихся к классу class_name
и скопирует их в элемент с идентификатором target
:
$("span").not(".class_name").clone().appendTo("#target");
Результат каждой операции – это массив элементов HTMLElement
. Размер массива можно узнать с использованием свойства length или функции size() . Аргументами операций могут быть не только строковые параметры, но и результаты других запросов. Вот пример того, как результат одного запроса можно поместить внутрь элемента, который, в свою очередь, являются результатом другого запроса:
$("span").not(".class_name").clone().appendTo($("span.class_name"))
В качестве аргумента можно использовать не весь результат запроса, а отдельный его элемент:
$("span.class_name").append($("span").not(".class_name"));
Таким образом, аргументом операции может быть либо селектор в виде строки, либо результат другого запроса, либо любой экземпляр HTMLElement .
Операции jQueryНиже представлены сводные таблицы с операциями jQuery, их кратким описанием и ссылками на те примеры, которые демонстрируют их применение на практике.
СвойстваВозвращают или устанавливают значения различных свойств выбранных элементов. Если необходимо определить новое значение свойства, то его следует передать в качестве аргумента, например, $(“#element”).text(text_value) или $(#element”).html(html_value) :
| text() | Текст. | - |
| offset() | Смещение {left, top}. | , функция перемещения шарика ball.move() : $("#ball").offset({left:$("#ball").offset().left + this.dx, top:$("#ball").offset().top + this.dy}); Данная функция вызывается по таймеру каждые 10 миллисекунд. |
| width(), height() | Ширина и высота. | - |
| html() | html разметка внутри выбранных элементов. |
Перед тем, как приступить к изучению библиотеки jQuery, ее следует подключить к нашему документу . Для этого давайте создадим самую простую страницу, без всяких излишеств – index.html, и на ней будем подключать наш jq (сокращение от jQuery, начинайте привыкать).
Как подключить библиотеку jQuery? И где взять код?Есть 2 способа подключения библиотеки к сайту . Перед тем, как начну описывать оба способа, не надо сразу повторять за мной. Сначала прочитайте об этих способах, а потом выберите подходящий вам способ и все подключите. Не волнуйтесь – jQuery подключается одной строчкой кода , поэтому, если вы не обладаете памятью, как у рыбки, то все будет хорошо.
Первый способ – качаем с сайта jquery.comЕсть такой замечательный сайт – это официальный сайт библиотеки. Как любая библиотека, jq разработали простые программисты. Они поняли, что можно уменьшить язык программирования JavaScript, начали долго и усердно трудиться – и в итоге получилась самая распространенная библиотека, горячо любимая веб-программистами.
Важно! Все картинки кликабельны.
Подключение библиотеки jQuery с официального сайта
На картинках ниже я показал небольшие куски кода двух версий.
В принципе, это 2 абсолютно одинаковые версии. Единственная разница между этими файлами – в jQuery сжатой версии весь код написан в одну строчку. В jQuery, которая предназначена для разработчиков – весь код идет с табуляцией, пробелами и соответственно его можно легко читать.
Так как для браузера (а именно браузер обрабатывает этот код) не видит разницы между двумя этими файлами, то лучше на своих «живых» проектах использовать сжатую версию, потому что она намного легче (из-за отсутствия пробелов). А как известно, чем меньше весят исходные файлы сайтов – тем быстрее он загружается, что положительно влияет на и поведенческий фактор.
Блок «1» - размер файла сжатой версии – 96 Кб.
Блок «2» - размер файла версии для разработчика – 280 Кб.
Полная версия почти в три раза тяжелее!
Не сжатая версия jQuery служит для того, чтобы более детально углубиться в эту библиотеку. Если вы очень дотошный разработчик, то можете удалить ненужные функции, добавить свои и т.д.
Лично я – вообще ни когда туда не залезал, за три года не было такой необходимости. Да и я не особо любитель читать 10 тысяч строчек.
Отличить эти 2 версии можно по названию. В сжатой версии перед.js всегда идет.min (на рисунке это показал в блоке под номером «3» ). Если вы достаточно долго уже работает в веб-разработке, то наверное замечали этот «фокус» у других библиотек.
Как подключить jQuery?Да подключение происходит также, как css, только используя другой тег.
Внимание! Весь код, который будете писать, используя jq – нужно писать ниже подключения этой библиотеки. В противном случае – у вас выскочит ошибка и ни чего работать не будет.
Второй способ – используем гуглПочему я просил не торопиться с закачкой этой библиотеки? Да все просто – ее можно напрямую подключить с Google.
Как известно, Google – не только поисковая система, но в этой гигантской корпорации присутствует много всяких фишек, которые созданы для облегчения жизни программиста.
Гугл использует также сжатую версию. И в этом коде можно найти одно важное дополнение – в ней присутствует ajax технология (об этом мы еще поговорим). Это очень полезная вещь, и рано или поздно она вам пригодится. И если вы подключите библиотеку с google – то вам не придется тратить свое время на поиск и подключения всех функций для ajax.
Т.к. google – очень крупная компания, их сервера ни когда не упадут, и поэтому можно быть полностью уверенным в том, чтобы jQuery всегда будет работать на вашем сайте.
Но есть один минус – если вы подключаете библиотеку с гугл, то при разработке сайта вам нужно постоянно иметь доступ к интернету.
Ну а теперь, когда я описал оба способа – можете выбирать более подходящий для вас и подключать к вашему html документу.
ТестированиеКак только вы подключили библиотеку, желательно ее протестировать. Ниже я привел часть jq-кода – особо не вдавайтесь в подробности (об этом будут дальнейшие уроки), что там написано, просто напишите тоже самое и посмотрите на результат.
Какой-то текст
После запуска страницы – должны появиться слова «Тут какой-то текст». А после нажатия на этот текст – он должен пропасть. Если у вас все именно так отработало, то вы все правильно сделали.
P.S. Иногда встречаются вопросы: «как подключить jQuery к Joomla 3?», «как подключить jQuery к Bitrix?», «как подключить jQuery к WordPress?». Не зависимо какой движок используете на сайте, способ подключения всегда одинаковый. В шаблон помещаем нужную строчку - и все у вас будет работать.Библиотеки JQuery знакомы дизайнерам и разработчикам не понаслышке. Это одна из самых популярных библиотек JavaScript, которые вы найдете в Сети.
Каждый уважающий себя дизайнер и разработчик знаком с функциями и возможностями этой библиотеки:
- jQuery предназначен для решения практически любой задачи на веб-сайте;
- jQuery может избавить вас от проблем, которые мешают вам в создании красивого и функционального сайта;
- если вам нужно решить проблемы кроссбраузерности — добавляйте библиотеки JavaScript в коллекцию применяемых вами инструментов.
Библиотеки JQuery — отличный инструмент для веб-разработчиков. В Сети есть огромное количество бесплатных плагинов.
На поиск нужных вы можете потратить очень много времени, потому как придется работать с каждым сайтом для того, чтобы найти последние и подходящие вам версии библиотек JQuery .
Поэтому, чтобы сэкономить ваше время, мы собрали в этой статье наиболее полезные библиотеки jQuery . Вы сможете использовать их на вашем сайте, чтобы добавить интересные и полезные эффекты.
1. Treed:Плагин Treed предоставляет вам возможность создания древовидной структуры вашего сайта. Он расширяемый, настраиваемый, мощный и очень легкий в использовании.
2. jQuery Vibrate:
Это плагин специально созданный для использования на мобильных устройствах. Он позволяет разработчику заставить вибрировать любое устройство в соответствии с настроенным шаблоном в определенный период времени.
3. Flight Indicators:
Очень простой в использовании плагин. Вы сможете отобразить высококачественные индикаторы полета с помощью HTML , CSS3 , JQuery и SVG -изображений.
4. jQuery LightSlider:
jQuery LightSlider — гибко настраиваемый тач-слайдер для отображения содержимого вашего сайта. В наличии эффекты slide и fade . Он совместим со всеми основными браузерами.
5. jQuery GoUp!
Очень прост в использовании. Позволяет посетителям вашего сайта переместиться на самый верх страницы в один клик.
6. Image Cropper:
Этот JQuery плагин позволяет обрезать изображения на сайте. Есть варианты настроек и предварительный просмотр. Вы также сможете установить высоту и ширину.
7. Devrama Slider:
Devrama полностью адаптивный слайдер изображений с уникальными возможностями. Поддерживает как изображения, так и HTML -контент. В наличии несколько вариантов эффектов смены картинок.
8. jQFader:
jQFader простой плагин для применения эффекта fade out к элементам вашего сайта. Прост в использовании. Легко подойдет к использованию на любом сайте.
9. Forkit:
Forkit.js это jQuery анимированный плагин, представляющий собой подобие занавеса, за которым вы можете спрятать дополнительный контент. Обычно располагается в правом верхнем углу.
10. Vertical News Slider:
Как и предполагает название, это вертикальный слайдер, основанный на jQuery и CSS 3, отображающий заголовки новостей. В наличии функция предпросмотра и краткого обзора новости.
11. Looking For:
Этот jQuery плагин позволяет выполнять поиск текста в списках, доступных на странице. Скрывает элементы, не совпадающие с поисковым запросом.
12. Browser Swipe:
Этот плагин создает эффект тачпада для пролистывания страниц, когда на сайте выключена прокрутка. Событие происходит при прокрутке колеса мыши.
13. Chicken Dinner:
ChickenDinner — уникальный jQuery плагин. Позволяет загружать изображения из массива картинок, созданного на стороне клиента, через img-теги или фоновые картинки.
14. Flicker Plate:
Полностью адаптивный и очень простой в использовании плагин. Позволяет создать подобие постраничного пролистывания контента на сайте.
15. SVGMagic:
Как конвертировать SVG -картинки в PNG -формат? Воспользоваться этой простой jQuery библиотекой. Она выполняет поиск изображений в SVG -формате на сайте, и, если браузер не поддерживает SVG , конвертирует их в PNG .
16. lazyYT:
Этим плагином можно воспользоваться для быстрого добавления видео из YouTube . При первой загрузке слой будет содержать превью-изображение видео, а по клику ролик будет воспроизведен.
17. ScrollMagic:
С помощью этого плагина вы сможете закрепить элемент страницы в определенном месте, включить анимацию, причем в тот момент, когда пользователь прокрутит страницу до определенного места.
18. RowGrid:
RowGrid — jQuery плагин, созданный для представления элементов страницы в виде таблицы. Небольшой и легкий в использовании инструмент.
19. Remodal:
Этот jQuery плагин используется для создания модальных окон с hash -трекингом. Полностью адаптивный, дизайн в стиле flat и очень легок в настройке.
20. Panorama Viewer:
Этот jQuery плагин может оказаться очень полезным для вашего сайта. Он позволяет добавлять панорамные изображения, что, несомненно, придаст странице еще больше уникальности.
21. Floatlabels:
Этот плагин, построенный на jQuery , знаком многим разработчикам. Его работа заключается в выводе некоего текста по-умолчанию в поле ввода и его смена, когда пользователь начинает печатать.
22. Fluidbox:
Очень полезный jQuery плагин. Расширяет и улучшает возможности модуля fluid light box . Работает в виде ссылки на увеличенное изображение.
23. Headroom:
Headroom.js поможет вам скрывать навигацию (либо другой контент из хедера) по сайту. Когда посетитель прокручивает страницу вниз — навигация исчезает, и появляется, когда пользователь возвращается к верхней части страницы.
24. A-Slider:
A-Slider адаптивный и простой слайдер, который, к тому же, поддерживает аудио-контент. Очень прост в использовании и довольно гибко настраивается с помощью HTML .
25. CoverflowJS:
Это проект coverflow , который позволит воссоздать эффект ‘CoverFlow’ с помощью компонентов jQuery UI и трансформаций CSS3 .
26. jQuery URLive:
Возможности этого jQuery плагина очень схожи с функционалом аттача в окне создания поста в Facebook . Позволяет создавать быстрые превью любого URL -адреса, основанные на свойствах
Плагин позволяет веб-приложениям загружать изображения под разные разрешения экранов.
28. jQuery Collapser:
Этот jQuery плагин позволяет скрывать текст, по словам, буквам, строкам с помощью довольно гибкого API . В наличии множество опций для скрытия абзацев.
29. Parallax ImageScroll:
Плагин, создающий эффект смещения картинки. Прост в использовании. Куча дополнительных опций для модификации. Анимация выполнена на CSS3 .
30. Block Scroll:
JQuery плагин, который разбивает контент сайта на страницы для лучшего представления и затем отображает их блоками.
31. Full Page Image Slideshow:
Полностраничный jQuery плагин, делающий слайд-шоу, которое автоматически заполняет изображением все пространство экрана. Размеры изображений автоматически подгоняются под размеры области просмотра.
32. EasyTree
jQuery плагин EasyTree предназначен для конвертации UL или JSON списков в древовидное меню вашего сайта. Легок в использовании и абсолютно бесплатен.
33. Mapsed:
Mapsed упрощает процесс отметки мест на карте. Вы также можете добавлять и редактировать места, если их нет в Google Places API .
34. Radiant Scroller:
Этот jQuery плагин позволяет создавать респонсивные скроллеры (карусели) с сеточной и простой горизонтальной разметками. Radiant Scroller поддерживает ряд опций для настройки, а также предоставляет API для управления.
35. Image Lightbox:
Минималистичный лайтбокс для картинок. Плагин, по умолчанию, не имеет подписей и кнопок навигации, что делает его простым, но аскетичным. Респонсивный и с поддержкой сенсорных устройств, работает на большинстве мобильных операционных систем.
36. Mr.JsonTable:
Этот плагин очень прост в использовании. С его помощью вы сможете оформить JSON данные в виде HTML таблицы, с возможностью пагинации и сортировки. Так же можно скрывать столбцы.
37. ImageFit:
ImageFit может оказаться очень полезным для разработчиков. Выполнен просто. Имеет малый размер. Поможет уместить любое изображение в любом месте вашего сайта.
38. Bootstrap Validator:
Этот плагин будет очень полезен, когда вы захотите добавить на ваш сайт возможности валидации. Имеет множество встроенных опций и очень прост в использовании.
39. Resize End Plugin:
Этот плагин используется для вывода сообщений после изменения размера окна браузера.
40. Adaptive Backgrounds:
Плагин использует превалирующий в картинке фона цвет и добавляет этот цвет к фону родительского элемента.
41. FormChimp:
jQuery плагин, представляющий собой полностью настраиваемую Mailchimp Ajax -форму, позволяет пользователю легко залогиниться в Mailchimp .
42. Password Peekaboo:
Плагин позволит временно показать вводимый пароль пользователю, если он того захочет.
