+3 (45634) 321-56-5
Contacts
Learn to create a logo in just 7 steps
A 3-day course for newbies and design students
© 2019 Tourit Media
Product
  • Home page
  • Tour
  • Templates
  • Prices
Education
  • Workshops
  • How to make a website
  • Design course
  • Explore
Help
  • Knowledge base
  • Video tutorials
  • Code Export
  • Developers
© 2019 Tourit Media
Product II
  • Home page
  • Tour
  • Templates
  • Prices
  • Templates
  • Prices
Education II
  • Workshops
  • How to make a website
  • Design course
  • Explore
  • Design course
  • Explore
Help II
  • Knowledge base
  • Video tutorials
  • Code Export
  • Developers
  • Code Export
  • Developers
© 2019 Tourit Media
Product III
  • Home page
  • Tour
  • Templates
  • Prices
  • Home page
  • Tour
  • Templates
  • Prices
Education III
  • Workshops
  • How to make a website
  • Design course
  • Explore
  • Workshops
  • How to make a website
  • Design course
  • Explore
Help III
  • Knowledge base
  • Video tutorials
  • Code Export
  • Developers
  • Knowledge base
  • Video tutorials
  • Code Export
  • Developers

Как сделать блочное выпадающее меню из связки блоков МЕ301 + FT302 в Tilda на экранах 980px +

1
Создали меню из блока МЕ301 высотой 80px и поставили отображение от 980px
2
Добавили в него 3 пункта меню
3
Создали 3 блока FT302
4
Добавили код на страницу
Скрипт вставляется в блок ДРУГОЕ►Т123
В коде заменили:
ID нашего меню МЕ301 #rec82569956
Mo-ti Level Up
Видео инструкции по добавлению кода и работе с Zero Block.
Получить полное видео
Посмотреть все видео
Создаём большое выпадающее меню из связки блоков ME301+FT302
Длительность видео: 15 мин
Фрагмент видео
Посмотреть видео в личном кабинете ►
Библиотека для примера

<style>
/*Настройка высоты вкладок */
.t228__list_item {
    height: 80px;
    display: inline-block  !important;
    padding: 0 15px !important;
   
}
/*Настройка вкладок */
.t228 .t-menu__link-item {
    height: inherit;
    display: table-cell !important;
    vertical-align: middle;
}
/*Цвет  вкладок при наведении */
.t228__list_item:hover {
    background:#171717;
    -webkit-transition: all 0.35s;
    transition: all 0.35s;
}
/*Настройка для блока FT302 */
[data-record-type="420"] {
    position: fixed;
    width: 100%;
    top: 80px;
    z-index: 990;
    left: 0;
    opacity: 0;
   -webkit-transition: all 0.35s;
   transition: all 0.35s;
   visibility: hidden;
   background: linear-gradient(to bottom, #171717 45%, #484848);
}
/*Появление меню при наведении на вкладку */
.t228__list_item:hover .mainmenu {
    display:block !important;
    opacity: 1;
    visibility: visible;
}
</style>

<script>
	$(document).ready(function(){
	//Добавляем классы к блокам FT302    
	$('[data-record-type="420"]').addClass('mainmenu');
	//Добавляем блоки FT302 к соответствующим вкладкам в меню с указанием ID этого меню
       for(let i = 0; i < $(".mainmenu").length; i++){
       $('.mainmenu:eq('+i+')').appendTo('#rec82569956 .t228__list_item:eq('+i+')');
   };
});
</script>
Made on
Tilda