VPF::Preloader картинки и вставка ее в background-image

Zuzzuk

Дата 9.12.2009, 17:57 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 49
Регистрация: 25.10.2007

Репутация: 1
Всего: 3

Здравствуйте.
Есть такая проблема - , на блоке стоит background-image размером с 1.5 мега и по этому сама картинка грузится очень долго.
По этому я решил сделать точную копию картинки, но с минимальным качеством, потом проверять загрузилась ли оригинальная картинка и менять ее сразу, как только она загрузилась.
Получилось вот что

Код


<script type='text/javascript'>
bgPreloader = function(picUrl, containerId){    
    var mainBlockBgChange = function(){
        if(!containerId) return false;
        mainBlock = document.getElementById(containerId);                
        mainBlock.style.backgroundImage = 'url(' + preloaderPic.src + ')';
    }
    
    preloaderPic = new Image()
    preloaderPic.src = picUrl;
    preloaderPic.onload = mainBlockBgChange;
        
}('images/mainBg.jpg', 'mainBlock')
</script>

mainBlockBgChange срабатывает сразу, как только picUrl загрузился, но к сожалению через firebug видно, что он качает ее еще раз, что бы поставить на background-image... ((
Может быть есть какой-нибудь способ?
Спасибо

brother79

Дата 10.12.2009, 06:33 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 471
Регистрация: 18.8.2009

Репутация: 1
Всего: 6

А если попробовать 2 дива друг за другом поставить, пока большая не загрузится - будет видно маленькую, как большая подгрузится - она перекроет маленькую. Разметку рисовать не буду, поди справишься, только идею могу предложить smile

--------------------

http://www.nastandart.com

Zuzzuk

Дата 10.12.2009, 12:49 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 49
Регистрация: 25.10.2007

Репутация: 1
Всего: 3

Да, спасибо за идею, я примерно так и сделал - на html поставил.
Просто думал, что есть какое-нибудь более элегантное решение.

brother79

Дата 10.12.2009, 13:00 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 471
Регистрация: 18.8.2009

Репутация: 1
Всего: 6

Цитата(Zuzzuk @ 10.12.2009, 12:49

)

Мне казалось, что если можно обойтись без всяких там js и обработки событий, куда уж более элегантное решение может быть? Тебе так и так грузить обе картинки.

--------------------

http://www.nastandart.com

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »