ГОРИЗОНТАЛЬНЫЙ АККОРДИОН C ВКЛАДКАМИ


ГОРИЗОНТАЛЬНЫЙ АККОРДИОН C ВКЛАДКАМИ


Симпатичная панель с раздвижными вкладками использующая библиотеку jQueryTools.

Подключаем в шапке необходимые файлы:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" 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>


javascript
И запускаем анимацию слайдов. Указываем класс дива к которому используем код и эффект - горизонтальный.
$(function() {
    $("#accordion").tabs("#accordion div", {
        tabs: 'img', 
        effect: 'horizontal'
    });
});


Скачать исходник:
horizontal_accordion_tabs.rar


скрипт скрипт ГОРИЗОНТАЛЬНЫЙ АККОРДИОН C ВКЛАДКАМИ
Статистика
0  
Всего статей 1025
0  
Всего комментариев 57
0  
Пользователей 3333
Обновления new
  • XenForo Resource Manager 1.1.4
  • Что такое Менеджер ресурсов (Resource Manager)? Менеджер ресурсов является официальным дополнением для XenForo, которое позволяет управлять
  • Boss Electronues - Шаблон для OpenCart
  • И так, данный шаблон заточен под OpenCart. В данном шаблоне есть не свойственная для магазинов возможность писать блоги. В шаблон встроен блог от
  • R.Gen - Шаблон на OpenCart
  • R.Gen - это отличный премиум шаблон на OpenCart. Отличный дизайн, полностью настраиваемый и в тоже время простой в шаблон для создания серьезного
  • 30 psd логотипов на разные тематики
  • Эта сборка из 30 psd логотипов на разную тематику. Логотипы схематичные, яркие, детализированные, в отличном качестве и в формате PSD. Логотипы не
  • Xenu Программа для проверки битых ссылок
  • Xenu старенькая но очень полезная программа для поиска битых ссылок на сайте. Описание: Проверка ссылок делается на: ссылки, изображения, рамок,
Информация