почему window.scrollTo () требует setTimeout () для работы? - PullRequest
Новая
       23

почему window.scrollTo () требует setTimeout () для работы?

0 голосов
/ 25 июня 2018

Вот HTML-страница, которая отображает три квадратных деления в верхнем левом углу: 

<div class="whiteish bigwidth" style="height:100%;">
    <div class="square greenish" style="left:50px; top:50px;"></div>
    <div class="square redish" style="left:70px; top:70px;"></div>
    <div class="square bluish" style="left:90px; top:90px;"></div>
</div>


<style>
    .bigwidth {
        width: 2000px;
        display: block;
    }
    .square {
        width: 100px;
        height: 100px;
        display: block;
        position: absolute;
    }
    .greenish {
        background-color: #75af99;
    }
    .redish {
        background-color: #ff9b98;
    }
    .bluish {
        background-color: #aabbff;
    }
    .whiteish {
        background-color: #eaeaea;
    }
    * {
        padding: 0;
        margin: 0;
    }
</style>

<script>
    window.addEventListener('load', function () {
        console.log('load event has fired')
        window.scrollTo(500, 0);
        // setTimeout(function() { window.scrollTo(500, 0); }, 0);
    })
</script>

В настоящее время команда window.scrollTo(500, 0);, возникающая при загрузке страницы, не действует (протестировано в Safari и Chrome).Но если мы заменим его вместо строки 

setTimeout(function() { window.scrollTo(500, 0); }, 0);

(закомментировано в приведенном выше коде), прокрутка произойдет.Почему это?

...