загрузить фоновое изображение перед другой графикой - PullRequest
0 голосов
/ 14 декабря 2011

Я бы очень хотел загрузить фоновое изображение перед изображениями на странице.

См .: http://carolineelisa.com/boy/animation/,, где я хочу загрузить бумажное изображение перед анимированными гифками.

Это может быть достигнуто с помощью CSS, или это будет немного Javascript или JQuery?

Спасибо!

Ответы [ 2 ]

1 голос
/ 14 декабря 2011

Конечно: это не надежная защита , и результаты могут отличаться в некоторых браузерах, но в большинстве случаев это должно давать удовлетворительные результаты.

<img id="bg_preload" src="path/to/image.jpg" style="position: absolute; top: -9999px;"/>
<img id="fg_1" class="fg_image" src="" style="visibility: hidden;"/>
<img id="fg_2" class="fg_image" src="" style="visibility: hidden;"/>
<img id="fg_3" class="fg_image" src="" style="visibility: hidden;"/>
<script type="text/javascript">
    $('#bg_preload').load(function() 
    {
        $('.fg_image').each(function() 
        {
            this.src = 'path/to/image.gif';
            this.style.visibility = 'visible';
        });
    });
</script>
1 голос
/ 14 декабря 2011

Рассмотрите возможность добавления анимированных GIF-файлов в DOM после того, как документ будет готов.

...