Горизонтальный аккордион c вкладками
Красивая панель с раздвижными вкладками построенная на библиотеке jQueryTools.
Подключаем в шапке сайта необходимые файлы:
<script type="text/jаvascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/jаvascript" src="js/jquery.tools.min.js"></script>
и CSS стили
<link rel="stylesheet" type="text/css" href="css/standalo.css"/>
<link rel="stylesheet" type="text/css" href="css/tabs-acc.css"/>
HTML
<div id="accordion">
<img src="images/firefox.png" />
<div style="width:200px;">
<h3>Firefox</h3>
<p>
Браузер нового поколения от Mozilla Foundation
</p>
</div>
<img src="images/opera.png" />
<div>
<h3>Opera</h3>
<p>
Исследуйте Веб с помощью самого быстрого браузера на планете.
</p>
</div>
<img src="images/chrome.png" />
<div>
<h3>Chrome</h3>
<p>
Новый браузер Хром загружает страницы в интернете на максимальной скорости.
</p>
</div>
</div>
JS
И запускаем анимацию слайдов. Указываем класс дива к которому используем код и эффект - горизонтальный.
$(function() {
$("#accordion").tabs("#accordion div", {
tabs: 'img',
effect: 'horizontal'
});
});
Ссылка для скачивания доступна только авторизованным пользователям, пожалуйста пройдите регистрацию.
Это займёт не более минуты. Не волнуйтесь, мы не спамим!
У данной публикации нет комментариев.
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.
Облако тегов
bootstrap Bootstrap css CSS CSS3 dle DLE fruit farm html html шаблон html5 HTML5 Payeer PNG PSD wap Wordpress Скрипт удвоителя адаптивный адаптивный шаблон бонусник дизайн игровой хостинг иконки лендинг модуль панель портфолио сайт скрипт скрипт фермы текстура удвоитель удвоитель Payeer ферма фон фруктовая ферма хак шаблон экономическая игра
Как обозначается тег в HTML