Простой спойлер с плавной анимацией для сайта на Jquery
Лёгкий и простой скрипт анимированного спойлера для сайта с использованием Jquery.
Это очень удобный и простой способ скрывать большое количество информации в маленькую ссылку либо кнопку.
Скрипт не создает никаких нагрузок и задержек на сайт.
Установка
Для работы нашего спойлера нам необходимо подключить к сайту JavaSctipt библиотеку.
Скачиваем последнюю версию, забрасываем на сайт и подключаем локально:
<script type="text/jаvascript" src="/jquery/1.7.2/jquery.min.js"></script>
Либо мы можем воспользоваться файлом библиотеки с серверов google:
<script type="text/jаvascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
Подключив к сайту библиотеку, нам нужно вставить код отвечающий за плавность работы спойлера:
<script type="text/jаvascript">
$(document).ready(function(){
$('.spoiler11').click(function(){
$(this).parent().children('div.spoiler_body').toggle('normal');
return false;
});
});
</script>
Далее, в том месте странички, где мы хотим использовать спойлер мы вставляем следующий код:
<div>
<a href="" class="spoiler11">Спойлер</a>
<div class="spoiler_body">
Текст под спойлером<br>
плавно появляется<br>
и плавно исчезает
</div>
</div>
Заметка!
каждый спойлер должен быть заключен между тегами
<div></div>
Это необходимо для того чтобы каждый спойлер открывался и закрывался отдельно, а не все сразу.
Ссылка для скачивания доступна только авторизованным пользователям, пожалуйста пройдите регистрацию.
Это займёт не более минуты. Не волнуйтесь, мы не спамим!
У данной публикации нет комментариев.
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.
Облако тегов
bootstrap Bootstrap CSS css CSS3 dle DLE fruit farm html html шаблон html5 HTML5 Payeer PNG PSD wap Wordpress Скрипт удвоителя адаптивный адаптивный шаблон бонусник дизайн игровой хостинг иконки лендинг модуль панель портфолио сайт скрипт скрипт фермы текстура удвоитель удвоитель Payeer ферма фон фруктовая ферма хак шаблон экономическая игра
Пользуетесь ли Вы облаком тегов