Ascia Wiki

MediaWiki:Common.js: различия между версиями

← Предыдущая правка
Нет описания правки
Нет описания правки
 
(не показаны 2 промежуточные версии этого же участника)
Строка 33: Строка 33:
});
});


// Автоскролл при открытии выпадающих блоков
// Автоскролл после открытия спойлера в меню Citizen
$(document).ready(function () {
$(document).on('click', '.dropdown .dropbtn', function () {
    // Находим все выпадающие блоки
    $('.dropdown .dropbtn').on('click', function () {
        let parent = $(this).closest('.dropdown');


        // Переключаем class .active
    var $dropdown = $(this).closest('.dropdown');
        parent.toggleClass('active');
    var $content = $dropdown.find('.dropdown-content');


         // Если блок открылся — скроллим
    // Даем CSS-анимации завершиться, если она есть
         if (parent.hasClass('active')) {
    setTimeout(function () {
             setTimeout(() => {
 
                $('html, body').animate({
         // Если блок теперь виден — скроллим к нему
                    scrollTop: parent.offset().top - 120 // подстройка под Citizen-header
         if ($content.is(':visible')) {
                }, 400);
             var top = $dropdown.offset().top - 80; // отступ сверху (регулируется)
            }, 300); // ждём окончания анимации max-height
            $('html, body').animate({ scrollTop: top }, 300);
         }
         }
    });
});
document.addEventListener("DOMContentLoaded", function () {
    const dropdowns = document.querySelectorAll(".dropdown");
    dropdowns.forEach(dropdown => {
        const btn = dropdown.querySelector(".dropbtn");
        btn.addEventListener("click", function () {
            // закрываем другие спойлеры
            dropdowns.forEach(d => {
                if (d !== dropdown) d.classList.remove("active");
            });
            // переключаем текущий
            dropdown.classList.toggle("active");


            // если открыт — скроллим к нему
    }, 200);
            if (dropdown.classList.contains("active")) {
                setTimeout(() => {
                    dropdown.scrollIntoView({
                        behavior: "smooth",
                        block: "start"
                    });
                }, 150); // ждем пока CSS-анимация начнёт увеличивать высоту
            }
        });
    });
});
});
Источник — http://asciawiki.ru/index.php/MediaWiki:Common.js