Как сделать чтобы прелоадер грузился сразу при загрузке страницы?

Question

[westdp]

Использую прелоадер который нашел в интернете, он мне очень нравится и подходит, но как мне сделать так чтобы он грузился сразу после загрузки страницы, т.е. оранжевое поле уже было с первой секунды видно, а не через пол или секунду после загрузки страницы?

Рабочий пример
А это стоит в футере:

<div id="hellopreloader">
    <div id="hellopreloader_preload"></div>
</div>

<script type="text/javascript">
    var hellopreloader = document.getElementById("hellopreloader_preload");

    function fadeOutnojquery(el) {
        el.style.opacity = 1;
        var interhellopreloader = setInterval(function () {
            el.style.opacity = el.style.opacity - 0.05;
            if (el.style.opacity <= 0.05) {
                clearInterval(interhellopreloader);
                hellopreloader.style.display = "none";
            }
        }, 16);
    }
    window.onload = function () {
        setTimeout(function () {
            fadeOutnojquery(hellopreloader);
        }, 0);
    };
</script>

Answer 1

[Radiks Alijevs]

Поставьте preloader в header (не в < head >)

<div id="hellopreloader">
    <div id="hellopreloader_preload"></div>
</div>

Comments

[westdp]

Поставил не помогло

[Radiks Alijevs]

westdp: поставьте сразу после тега < body >

[westdp]

Радик Алиев тоже самое

[Radiks Alijevs]

westdp: Уберите из head и поставьте сразу после тега < body >, не видно пока изменений этих

[westdp]

Радик Алиев поставил сразу после тега < body >

Answer 2

[Максим Софронов]

Уберите из head вы что?

Поставьте сразу после body и стили не пишите внизу, а перед прелоадером. А еще лучше в файле css.