Как заставить функцию JQuery setTimeout () работать после перехода страницы в swup или другие библиотеки?

У меня есть index.html с некоторыми анимациями с использованием setTimeout функцию и ссылку на about.html. я использую swupдля перехода между страницами. Но когда я перееду в about.html затем вернись к index.htmlничего не произошло. Потому как setTimeoutснова не сработало. Есть ли способ сделать setTimeout работают даже после перехода страницы??

Вот мой js код:

//page transition using swup
const swup = new Swup();
$(document).ready(function () {
$(document).on("click", ".link a", function (e) {
    $(this).parent().addClass("active");
    $(this).parent().siblings().removeClass("active");
});
const textSpans = document.querySelectorAll(".my-text span");
textSpans.forEach(span => span.addEventListener('mouseenter', function (e) {
    span.classList.add('animated', 'rubberBand')
}))
textSpans.forEach(span => span.addEventListener('mouseleave', function (e) {
    setTimeout(() => {
        span.classList.remove('animated', 'rubberBand');
    }, 500);
}))
setInterval(() => {
    delay = 0;
    $(".my-text span").each(function (index, element) {
        setTimeout(() => {
            $(element).addClass("animated pulse");
        }, delay);
        delay += 40;
        setTimeout(() => {
            $(element).removeClass("animated pulse");
        }, 1800);
    });
}, 3000);
delay = 0;
$(".laptop-codes span").each(function (i, elem) {
    setTimeout(() => {
        $(elem).css("display", "initial");
    }, delay);
    delay += 20;
});
setTimeout(() => {
    $(".key-buttons .enter-key").css("background", "#ff5722");
    setTimeout(() => {
        $(".key-buttons .enter-key").css("background", "#38384b55");
        $(".laptop-con").addClass("laptop-transform");
    }, 100);
}, 2200);
setTimeout(() => {
    $(".my-text").fadeIn(3000);
}, 3000);
setTimeout(() => {
    $(".laptop-con .laptop-icon").css("transform", "rotate(-15deg)");
}, 3500);
$(document).on("click", ".key-buttons p", function (e) {
    e.preventDefault();
    $(".laptop-con .laptop-icon").toggleClass("laptop-rotate");
});
});

0 ответов

Другие вопросы по тегам