Задержка анимации после переключения вкладки в браузере

Question

У меня есть анимация самолета, когда самолет достигает города, он открывает информацию о городе, меняет фон сайта и так далее, но когда я нажимаю на другую вкладку в браузере, а затем go обратно на мой сайт время появления этих всплывающих окон перепутано, есть ли что-нибудь, как я могу это исправить? Вот весь мой код HTML, просто напишите мне, если вам также понадобится CSS по какой-либо причине, спасибо и удачного дня.

PS У меня тоже есть bootstrap, css, jquery и c. связаны, но этот сайт не позволяет мне показать это в приведенном ниже коде.

Мой сайт: http://pouze.kvalitne.cz/blog
Мой код: `

<!-- -----*-----NAVIGAČNÍ MENU-----*----- -->
<div class="menu-btn" id="burger">
    <div class="menu-btn__burger"></div>
</div>
<!-- Start Home Section -->
<div id="home">
    <div class="airplane"></div>
    <div class="bg" id="bg">
        <img src="img/transparent.png">
    </div>
    <div class="london" id="london_point">
        <img src="img/point.png" width="40px" id="london_point">
    </div>
    <div class="london_info" id="london_info">
        <li>
            <div class="london_speech"></div>
            <h2>London</h2>
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Phasellus faucibus molestie nisl.
                <a href="#london">Read more...</a>
            </p>
        </li>
    </div>
    <div class="washington">
        <img src="img/point.png" width="40px" id="washington_point">
    </div>
    <div class="washington_info" id="washington_info">
        <li>
            <div class="washington_speech"></div>
            <h2>Washington D.C.</h2>
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Phasellus faucibus molestie nisl.
                <a href="#washington">Read more...</a>
            </p>
        </li>
    </div>
    <div class="brasilia">
        <img src="img/point.png" width="40px" id="brasilia_point">
    </div>
    <div class="brasilia_info" id="brasilia_info">
        <li>
            <div class="brasilia_speech"></div>
            <h2>Brasília</h2>
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Phasellus faucibus molestie nisl.
                <a href="#brasilia">Read more...</a>
            </p>
        </li>
    </div>
</div>
<!-- End Home Section -->
<!-- Start About Us Section -->

    <div class="about-container">
        <div class="about-text">
            <p>About our BLOG</p>
            <p>...Half programming rest traveling</p>
            <p>We enjoy traveling, especially to very different places. ...</p>
            <p>
                Shipton's traveling companion, Penelope Something, hysterically filled in what little she knew to Jake Weller and Emile Corday, both of whom visited the patient at the hospital. ...
            </p>
            <button>See more</button>
        </div>
    </div>
    <div class="container_one"></div>
<!-- End About Us Section -->
<!-- Start Video Section -->
<div class="about-container_two">
    <div class="about-text_">
        <p>What is our purpose</p>
        <div id="carouselExampleFade" class="carousel slide carousel-fade" data-ride="carousel">
            <div class="carousel-inner">
                <div class="carousel-item active">
                    <iframe width="889" height="369" src="https://www.youtube.com/embed/BtNAX36j1c4" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                    <!-- <img src="../blog/img/unnamed.jpg" class="d-block w-100" alt="..." />-->
                </div>
                <div class="carousel-item">
                    <iframe width="889" height="369" src="https://www.youtube.com/embed/TYHh5PLcReY" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                </div>
                <div class="carousel-item">
                    <iframe width="889" height="369" src="https://www.youtube.com/embed/EwmvBnR_xtA" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                </div>
            </div>
            <a class="carousel-control-prev" href="#carouselExampleFade" role="button" data-slide="prev">
                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                <span class="sr-only">Previous</span>
            </a>
            <a class="carousel-control-next" href="#carouselExampleFade" role="button" data-slide="next">
                <span class="carousel-control-next-icon" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
            </a>
        </div>
    </div>
</div>
<!-- End Video Section -->
<!-- Start Copyright Section -->
<div class="card text-center" style="margin-top: 50%;">
    <div class="card-footer text-muted">
        &copy; Michal & Kuba
        <p>2020</p>
    </div>
</div>
<!-- End Copyright Section -->
<script src="js/main.js"></script>
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>

<script>
    var washington_start = setTimeout(washington_timer, 10000);
    var london_stop;
    var washington_start;
    var washington_stop;
    var brasilia_start;
    var brasilia_stop;

    function washington_timer() {
        document.getElementById("washington_info").style.opacity = '1';
        document.getElementById("washington_info").style.visibility = 'visible';
        document.getElementById("washington_info").style.transition = '.5s';
        document.getElementById("washington_info").style.zIndex = '4';
        document.getElementById("washington_info").style.backgroundColor = '#00aabb';
        document.getElementById("washington_info").style.scale = '1';
        document.getElementById("bg").style.backgroundImage = "url('img/washington.jpg')";
        document.getElementById("bg").style.backgroundSize = 'cover';
        document.getElementById("bg").style.transition = '1s';
        washington_stop = setTimeout(washington_stoper, 3400);
    }

    function washington_stoper() {
        document.getElementById("washington_info").style.opacity = '0';
        document.getElementById("washington_info").style.visibility = 'hidden';
        document.getElementById("washington_info").style.zIndex = '2';
        document.getElementById("washington_info").style.scale = '0';
        document.getElementById("bg").style.backgroundImage = "url('img/chata_blured.jpg')";
        document.getElementById("bg").style.transition = '1s';
        brasilia_start = setTimeout(brasilia_timer, 4250);
    }

    function brasilia_timer() {
        document.getElementById("brasilia_info").style.opacity = '1';
        document.getElementById("brasilia_info").style.visibility = 'visible';
        document.getElementById("brasilia_info").style.transition = '.5s';
        document.getElementById("brasilia_info").style.zIndex = '4';
        document.getElementById("brasilia_info").style.backgroundColor = '#00aabb';
        document.getElementById("brasilia_info").style.scale = '1';
        document.getElementById("bg").style.backgroundImage = "url('img/brasilia.jpg')";
        document.getElementById("bg").style.transition = '1s';
        brasilia_stop = setTimeout(brasilia_stoper, 6000);
    }

    function brasilia_stoper() {
        document.getElementById("brasilia_info").style.opacity = '0';
        document.getElementById("brasilia_info").style.visibility = 'hidden';
        document.getElementById("brasilia_info").style.zIndex = '2';
        document.getElementById("brasilia_info").style.scale = '0';
        document.getElementById("bg").style.backgroundImage = "url('img/chata_blured.jpg')";
        document.getElementById("bg").style.transition = '1s';
        london_start = setTimeout(london_timer, 10000);
    }

    function london_timer() {
        document.getElementById("london_info").style.opacity = '1';
        document.getElementById("london_info").style.visibility = 'visible';
        document.getElementById("london_info").style.transition = '.5s';
        document.getElementById("london_info").style.zIndex = '4';
        document.getElementById("london_info").style.backgroundColor = '#00aabb';
        document.getElementById("london_info").style.scale = '1';
        document.getElementById("bg").style.transition = '1s';
        document.getElementById("bg").style.backgroundImage = "url('img/london.jpg')";
        london_stop = setTimeout(london_stoper, 6000);
    }

    function london_stoper() {
        document.getElementById("london_info").style.opacity = '0';
        document.getElementById("london_info").style.visibility = 'hidden';
        document.getElementById("london_info").style.zIndex = '2';
        document.getElementById("london_info").style.scale = '0';
        document.getElementById("bg").style.transition = '1s';
        document.getElementById("bg").style.backgroundImage = "url('img/chata_blured.jpg')";
        washington_start = setTimeout(washington_timer, 10000);
    }
</script>

`