Главная » 2014 » Май » 5 » Выпадающие панели на плагине jQuery - Collapse (Javascript)
05.05.2014, 21:16

Выпадающие панели на плагине jQuery - Collapse



Пространства на веб страницах всегда мало. Поэтому решения для организации раскрывающихся панелей с содержанием всегда будут пользоваться популярностью.

Плагин jQuery Collapse - легкое модульное решение для простой организации раскрывающихся панелей.

Плагин поддерживает работу с куки для хранения состояния панелей. Среди опций есть возвратные функции для настройки процесса открывания и закрывания секций.

ДЕМО

На нужную страницу в <head> поставьте:
Код
<script src="jquery.min.js"></script>
<script src="jquery.collapse.js"></script>
<!-- Если требуется поддержка куки -->
<script src="jquery.cookie.js"></script>  
<script>
$(function() {
  $("#demo").collapse();
});
</script>


2. В то место, где должны быть панели:
Код
<div id="demo">
  <h3>Фрукты</h3>
  <ul>
  <li>Яблоко</li>
  <li>Персик</li>
  <li>Апельсин</li>
  </ul>
  <h3>Информация</h3>
  <div>
  <p>Вы можете использовать любой контейнер  
  (в данном случае - div)</p>
  </div>
</div>

Не забудте залить файлы js на сайт.
Опции

show - Функция, которая определяет визуальное раскрытие содержания.
по умолчанию:
Код
function() { this.show(); }


hide - Функция, которая определяет визуальное скрытие содержания.
по умолчанию:
Код

function() { this.hide(); }


head - Тип элемента, который будет исопльзоваться как упарвляющий заголовок.
по умолчанию
"h2"

group - Тип элемента, который группирует скрываемое содержание.
по умолчанию
"div, ul"

cookieName - Имя куки, которое используется плагином.
“collapse”
Материал взят с сайта infoscript.ru
Теги: Скачать Выпадающие панели на плагине jQuery - Collapse
Скачать "Выпадающие панели на плагине jQuery - Collapse"
Внимание! Копирование данного материала запрещено без указания ссылки на сайт Infoscript.ru
Источник/Автор: ruseller.com/
Категория: JavaScript's | Просмотров: 2400 | Добавил: sold93 | Рейтинг: 4.0/1 |
Теги: Плагин, на, jquery, Collapse, панели, выпадающие
Пока комментариев нет. Ты можешь быть первым!
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]