К основному контенту
Личный кабинет
Установить бесплатно

1 мин

Zeroblock

Light

5
Установить бесплатно

Этот скрипт позволит тебе сделать любое количество независимых друг от друга табов, для переключения сразу нескольких блоков одновременно (например если в одной вкладке должно быть 2+ зеро). Модификация совместима с Autoscale.

Как сделать вкладки для переключения нескольких блоков?

(cвернуть)
Инструкция
Как установить
Связаться
Тарифы
Библиотека
Меню
Личный кабинет
Пример работы
vtab1-1
vt1prev
vt1next

1. Создай в зероблоке не более 8-ми кнопок\шейпов\того, что будет табами

2. Задай каждому из этих элементов класс vtab и припиши порядковый номер табов (т.е. одни табы это один сгенерированный код) и через черту порядковый номер твоего таба (т.е. vtab1-1 это первая кнопка первых табов, vtab1-2 вторая и тд)

3. Укажи порядковый номер табов на странице в генераторе

4. При необходимости настрой цвета активного таба и \ или подчеркивания активного таба. Если тебе не нужно изменять их, оставь поля пустыми

5. Если будешь делать кнопки переключения между табами, задай им классы vtprev и vtnext и тоже пропиши в них порядковый номер в середину класса (например vt1prev это кнопка назад для первых табов, vt2next - это кнопка вперед для вторых)

6. Добавь на страницу блок ME603, укажи в нём блоки которые должна открывать каждая вкладка и пропиши в генератор его recid

7. Скопируй код и вставь в блок т123 ПОСЛЕ переключаемых табами блоков

- Модификация не совместима с basic animation в переключаемых табами Zero

- Если используешь эти табы вместе с моими другими табами и ЭТИ табы у тебя стоит под ДРУГИМИ, то блок МЕ603 на котором основываются эти табы может неправильно рассчитать высоту страницы и получится бесконечный скролл. В таком случае просто замени другие табы на эти и всё

Важно!

undefined
undefined
undefined
Отчистить поля
Загрузить сохраненные значения
undefined
Скопировать код
 
123

Табы назначенны на кнопки. В переключаемых зеро задана sbs animation по element on screen. Выставлен белый фон и черный цвет текста для активной кнопки таба.

Примеры работы модификации
Tab 1
Tab 2
Tab 3
Zero Block 1
Tilda Publishing
create your own block from scratch
Zero Block 2
Tilda Publishing
Теперь кнопок может быть сколько угодно и они могут быть в самих табах
Tab 1
Tab 2
Табы назначенны на кнопки. Под табами в зеро добавлена белая линия. Для активной кнопки таба задано белое подчёркивание с высотой в 3 рх
Tab 1
Tab 2
Tab 3
Tab 4
Пример работы модификации 2
Zero Block 1
Tilda Publishing
create your own block from scratch
Zero Block 2
Tilda Publishing
create your own block from scratch
В этом примере табы добавлены в каждый из переключаемых блоков и фактически они "переключают сами себя". Сначала был создан один зеро и потом откопирован с заменой контента справа
Tab 1
Пример работы модификации 3
Tab 2
Tab 3
Tab 4
There is no design without discipline. There is no discipline without intelligence.
В этом примере табы добавлены в каждый из переключаемых блоков и фактически они "переключают сами себя". Сначала был создан один зеро и потом откопирован с заменой контента справа
Tab 1
Пример работы модификации 3
Tab 2
Tab 3
Tab 4
Everything should be made as simple as possible, but not simpler.
В этом примере табы добавлены в каждый из переключаемых блоков и фактически они "переключают сами себя". Сначала был создан один зеро и потом откопирован с заменой контента справа
Tab 1
Пример работы модификации 3
Tab 2
Tab 3
Tab 4
Lorem ipsum lorem shmipsum lorem gigaipsum
В этом примере табы добавлены в каждый из переключаемых блоков и фактически они "переключают сами себя". Сначала был создан один зеро и потом откопирован с заменой контента справа
Tab 1
Пример работы модификации 3
Tab 2
Tab 3
Tab 4
The work you do while you procrastinate is probably the work you should be doing for the rest of your life.