Skip to content

Latest commit

 

History

History
48 lines (42 loc) · 1.75 KB

README.md

File metadata and controls

48 lines (42 loc) · 1.75 KB

tabsToSelect

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

пример

HTML

<div class="tts-tabs">
    <ul class="tts-tabs-switchers">
        <li class="tts-tabs-switcher active">таб 1</li>
        <li class="tts-tabs-switcher">таб 2</li>
        <li class="tts-tabs-switcher">таб 3</li>
    </ul>

    <div class="tts-tabs-item active">контент таба 1</div>      
    <div class="tts-tabs-item">контент таба 2</div> 
    <div class="tts-tabs-item">контент таба 3</div> 
</div>

минимум js для работы плагина

$.tabsToSelect();

js (полный пример)

$.tabsToSelect({
    // Класс, добавляемый с селекту
    selectCalss: 'styler', 
    // Класс, добавляемый с обёртке селекта
    selectWrapperCalss: 'styler-wrapper', 
    // Куда вставлять сформированный селект (селектор внутри блока с табами)
    selectAppendTo: '',
    onInit: function () {
       // Срабатывает при инициализации плагина
    },
    beforeTabSwich: function (e) {
        // Срабатывает перед сменой активного таба
        // Если функция вернёт false - смена таба не произойдёт
    },
    afterTabSwich: function (e) {
        // Срабатывает после смены активного таба
    },
    onResized: function () {
        // Срабатывает при изменении размера окна
    }
});