Вкладки Табы Переключатели по клику в ZERO блоке Тильды. Табы ЗЕРО блок. Вкладки Tilda
Вкладки Табы Переключатели по клику в ZERO блоке Тильды. Табы ЗЕРО блок. Вкладки Tilda.
=================
ССЫЛКА на программный код:
=================
🏆 Мой СУПЕР-Курс по программированию в Тильде:
Скорая помощь по Тильде (и не только):
=================
ЗАРАБАТЫВАЙТЕ СО МНОЙ:
=================
Нередко при создании сайтов на Тильде возникает необходимость сделать табы. Это такие кнопки-переключатели, при клике на которые меняется контент в некоторой области.
Я покажу способ, который не требует ежемесячной оплаты подписки на различные сервисы и установки расширений в браузере.
Кроме того, кнопки-переключатели вкладок можно располагать как угодно, не обязательно горизонтально или вертикально. Кнопками могут быть любые объекты – тексты, шейпы, изображения или векторы, а табы могут состоять из любого количества любых объектов и располагаться они тоже могут по-всякому.
У меня в примере показаны табы в ЗЕРО-блоке, состоящие из шейпов, текстов и изображений, и вообще всё тут я нарисовал так, чтобы оно имело привычный Вам для табов вид, но Вы можете использовать абсолютно любые элементы, доступные в ZERO блоках, и размещать их как пожелаете.
По большому счёту – это и табами назвать трудно, потому что свободы в дизайне мой способ даёт гораздо больше. И кнопки переключатели вкладок и сами табы, а точнее – элементы, из которых они состоят, могут находиться в любых местах страницы – хоть в одном ЗЕРО блоке, хоть в разных, и даже разбросаны по телу страницы, шапке и подвалу - всё равно всё будет работать – при клике на соответствующие кнопки-переключатели будут исчезать и появляться соответствующие им объекты: изображения, тексты, шейпы, другие кнопки, векторы, галереи, формы обратной связи и так далее.
Реализуется всё предельно просто: элементам, которые выступают в качестве кнопок, по правой клавише мыши из контекстного меню назначьте классы: для первой кнопки «switchbutton1», для второй -«switchbutton2», для третьей - 3 и так далее.
Элементам, которые должны появляться при клике на первую кнопку и пропадать при клике на другие, назначьте класс «switchelem1». Для элементов, соответствующих второй кнопке, прописываем класс «switchelem2», для третьей – 3 и так далее.
Как Видите, такой способ действительно позволяет использовать любые элементы и размещать их как попало.
Верстаем всё это для разных размеров дисплея, а потом просто добавляем на страницу из раздела «Другое» блок «T123-HTML» и по клику на кнопку «Контент» вставляем в него мой программный код.
Публикуем – и всё работает!
Ключевые слова:
табы в тильде
табы в tilda
табы в зеро блоке
табы в zero
вкладки в тильде
вкладки в tilda
вкладки в зеро блоке
вкладки в zero
1 view
1608
418
1 month ago 00:13:54 1
Женская версия Астариона и Уилла в Baldur’s Gate 3
1 month ago 00:08:48 2
Cursor UPDATE The BEST Code Editor just got EVEN BETTER! (New Notepads, Speed, Etc!)
2 months ago 00:11:20 1
ПЕРЕШЕЛ НА ARIZONA V! ОТКРЫТИЕ КЕЙСОВ НА 20000₽! АДАПТАЦИЯ НА НОВОМ СЕРВЕРЕ! GTA 5 RP
2 months ago 00:08:11 144
Поезд Пожиратель из ЛЕГО/RC LEGO SCP Train Eater/Уникальная самоделка Поезд Пожиратель на ПУЛЬТЕ
2 months ago 00:09:41 41
Ходячее Молоко из ЛЕГО/Lego Milkwalker/SCP Монстры Тревора Хендерсона/Новая СЦП самоделка из Лего/
2 months ago 00:20:39 27
BANANA EATER vs Банан Пожиратель/3Dручка против Lego/Нарисовали 3Dручкой монстра Тревора Хендерсона
2 months ago 00:31:03 133
[Kison] я ПОЗНАЛ Киберпанк 2077
2 months ago 00:18:25 1
AppShell 1 – Навигация
2 months ago 00:00:24 1
DGPT - ЗАРАБАТЫВАЙ с И.Интелектом от 90-150% в МЕСЯЦ.