На данный момент FandomMobile не поддерживает мобильный JS, но как только это произойдет, таббер сразу же будет работать на мобильных устройствах. А пока суть да дело, он отлично работает на ПК.

Installation

Очень рекомендуется ставить оба кода - и CSS, и JS, так как JavaScript загружается спустя 1 секунду после открытия страницы, вызывая скачок элементов на экране. Установка CSS предзагрузит страницу и откроет её в конечном варианте, а изменения в функционале навигации будут незаметны глазу.

JS installation

CSS installation

Usage

Вставьте код ниже для того, чтобы получить таббер с тремя вкладками. Первая вкладка будет уже открыта при загрузке страницы. Вы можете изменить это, придав значение <active> другому элементу.

<div class="tabs">
<ul class="tabs__caption">
	<li class="active">Вкладка 1</li>
	<li>Вкладка 2</li>
	<li>Вкладка 3</li>
</ul>
<div class="tabs__content active">Текст 1</div>
<div class="tabs__content">Текст 2</div>
<div class="tabs__content">Текст 3</div>
</div>

Используйте class="tabs vertical" вместо class="tabs" чтобы получить вертикальный таббер.

Нововведения

• Современный таббер в WDS-стиле.
• Таббер хорошо работает на мобильных устройствах (пока общий JS отключён, тестирование проводилось в персональном JS).
• Табы можно переименовывать в визуальном редакторе.

See also

Обновления