Навигация

Движки сайтов
Движки форумов
Движки соц. сетей
Движки торрент трекеров

Online

Сейчас на сайте:
Пользователей: 0
Отсутствуют.

Роботов: 2
YandexGooglebot

Гостей: 90
Всех: 92

30ка посетивших:
Пользователей: 30
Alex1 BADam
bleavenny ChaSe
Core System darkstar
delisovruh Fох
josp kacpar
kysovue MaXiKo
Maxivol nadz3r.js
Nooo pheonix
pipulas quiet
SaNcHeS serGUCCI
SHADOW-dk SnaiPer
Steve Fox tomasci
vadim74a walik50
wenik worldos
wwwesko Эйден Пирс

Реклама

Главная страница » Разное » Простой спойлер с плавной анимацией для сайта на Jquery

Простой спойлер с плавной анимацией для сайта на Jquery

0
Простой спойлер с плавной анимацией для сайта на Jquery

Лёгкий и простой скрипт анимированного спойлера для сайта с использованием Jquery.
Это очень удобный и простой способ скрывать большое количество информации в маленькую ссылку либо кнопку.
Скрипт не создает никаких нагрузок и задержек на сайт.

Установка
Для работы нашего спойлера нам необходимо подключить к сайту JavaSctipt библиотеку.
Скачиваем последнюю версию, забрасываем на сайт и подключаем локально:
<script type="text/javascript" src="/jquery/1.7.2/jquery.min.js"></script>

Либо мы можем воспользоваться файлом библиотеки с серверов google:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>



Подключив к сайту библиотеку, нам нужно вставить код отвечающий за плавность работы спойлера:
<script type="text/javascript">
$(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>
Это необходимо для того чтобы каждый спойлер открывался и закрывался отдельно, а не все сразу.
alert Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь. Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
alert Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.

Опрос

    Зайдёте ли Вы на сайт, ещё?

    Да, я-же старожил win
    Да, я новичок hunter
    Нет nos

Топ 10 SM

BegleZZZ 1598/100
SaNcHeS 540/170
леший 396/320
4
jing 381/200
5
Stenly 357/0
6
marilym 345/70
7
aviatar 343/0
8
silence1988 329/200
9
FrosTPK 294/0
10
ChaSe 289/100

Последние покупки

ChaSe
Зашрифтовал ник
SaNcHeS
Поставил статус
леший
Накормил ник
Ferzik
Поставил статус
Ferzik
Накормил ник

Наши друзья