YOUX agency

Выпадающее меню второго уровня в zero блок

Кастомный код для добавления выпадающего zero блок для вашего меню на сайт Тильда. Показываем меню при наведнии

Пункт 1
Пункт 2
Пункт 3
Пункт 1
Пункт 2
Пункт 3
Пункт 1
Пункт 2
Пункт 3
Заказать код
Вступить в чат
Предложить код
Видео-урок

Инструкция

1

Добавьте ссылку кнопке в вашем меню #youxmenu и создайте новый зеро блок

2

Вставьте код ниже в блок "T123"

3

Замените в коде ID вашего zero блока

Код скопирован

<!-- Выпадающее меню второго уровня в zero блок -->
 <!-- https://youx.agency/vypadayushhee-menyu-vtorogo-urovnya-v-zero-blok -->
 
<style>
                            /*Скрываем наши блоки по ID*/
                            #rec562720903 {
                                display: none;
                            }
                            </style>

                            <script>
                            var showTimeoutId;
                            var hideTimeoutId;

                            // Показываем первый блок при наведении на кнопку со ссылкой #youxmenu
                            $('[href="#youxmenu"]').mouseenter(function() {
                                showTimeoutId = setTimeout(function() {
                                    $('#rec562720903').slideDown(500, function() {
                                        t_lazyload_update();
                                    });
                                }, 500);
                            });

                            // Скрываем первый блок при уходе курсора с кнопки со ссылкой #youxmenu
                            $('[href="#youxmenu"]').mouseleave(function() {
                                clearTimeout(showTimeoutId);
                                hideTimeoutId = setTimeout(function() {
                                    $('#rec562720903').slideUp(500, function() {
                                        t_lazyload_update();
                                    });
                                }, 200);
                            });

                            // Отменяем таймеры при наведении курсора на выпадающий блок
                            $('#rec562720903').mouseenter(function() {
                                clearTimeout(showTimeoutId);
                                clearTimeout(hideTimeoutId);
                            });

                            // Скрываем первый блок при уходе курсора с выпадающего блока
                            $('#rec562720903').mouseleave(function() {
                                hideTimeoutId = setTimeout(function() {
                                    $('#rec562720903').slideUp(500, function() {
                                        t_lazyload_update();
                                    });
                                }, 200);
                            });

                            // Отменяем таймер при наведении на выпадающий блок
                            $('#rec562720903').mouseenter(function() {
                                clearTimeout(hideTimeoutId);
                            });
                            </script>

Другие модификации