Топ плагинов jQuery. Плагин jQuery читать далее для работы с текстом

Топ плагинов jQuery. Плагин jQuery читать далее для работы с текстом

От автора: и снова здравствуйте. Позвольте представить вам очередной плагин из разряда must have. Сегодня мы познакомимся с простым, но вместе с тем весьма полезным плагином Readmore.js, который позволяет скрыть часть текста под кнопкой читать далее. Плагин jQuery читать далее также реализует эффект, известный как jQuery спойлер.

Итак плагин jQuery читать далее, с которым мы сегодня поработаем, позволяет скрывать часть текста за кнопкой читать далее, проще говоря, реализуется эффект jQuery спойлер. Весьма полезная функция, особенно для новостных сайтов и блогов, где много информации и часто не хватает места на странице. В этих случаях прибегают к сокрытию, к примеру, полного текста новости за спойлером, иначе говоря, под кнопкой читать далее.

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

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

Далее нам потребуется относительно длинный фрагмент текста, я добавлю пару статей.

Топ плагинов jQuery. Плагин jQuery читать далее для работы с текстом

Ну и осталось лишь инициализировать сам плагин jQuery читать далее, вызвав метод readmore():

Топ плагинов jQuery. Плагин jQuery читать далее для работы с текстом

Отлично, плагин работает! Осталось лишь настроить его по своему вкусу, передав необходимые опции в плагин. Например, я хочу стилизовать ссылку под кнопку, поменять текст ссылки, изменить скорость анимации при открытии полного текста, а также изменить высоту короткой части статьи. Все это позволяют сделать следующие опции:

Топ плагинов jQuery. Плагин jQuery читать далее для работы с текстом

Как видим, ничего сложного — все просто. Думаю, плагин jQuery читать далее будет вам полезен. На этом у меня сегодня все. Исходники к статье вы можете скачать по ссылке. Больше о jQuery и JavaScript вы можете узнать из наших уроков или курса. Удачи!

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

JavaScript. Полное руководство

Изучите самый популярный язык разработки и станьте высокооплачиваемым профи

Подробнее

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий