X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Подгрузка изображения
RayOfLight
RayOfLight
Topic Starter сообщение 27.8.2010, 18:22; Ответить: RayOfLight
Сообщение #1


Простая галерея. При наведении мышкой на превью меняется бэкграунд дива с большой фоткой.
[IMG]http://img46.imageshack.us/img46/8088/screenshot1ir.png[/IMG]
Проблема в том, что изображения не подгружаются моментально, поэтому картинка меняется раза со второго-третьего. Как мне устроить смену изображения только после подгрузки фотографии?

Код скрипта:
function zoom(path) {
    var div = document.getElementById('mainphoto');
    
    var img = document.createElement('img');
    img.src = path;
    imgWidth = img.width;
    imgHeight = img.height;
    
    div.style.cssText = 'background-image: url('+img.src+'); width: '+imgWidth+'px; height: '+imgHeight+'px;';    
    }
}
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Alcorn
Alcorn
сообщение 27.8.2010, 18:53; Ответить: Alcorn
Сообщение #2


Делать некликабильным нижний ряд пока не загрузится изображение? И разблокировать по <img onload>? Или не так понял?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
RayOfLight
RayOfLight
Topic Starter сообщение 27.8.2010, 19:10; Ответить: RayOfLight
Сообщение #3


Alcorn, смотри, при наведении на маленькую картинку должен меняться бэкграунд у дива (большая картинка).
Мне нужно сделать, чтобы бэкграунд не менялся, пока не подгрузится большая картинка для него.
Не знаю как еще объяснить )
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
locky-yotu
locky-yotu
сообщение 27.8.2010, 22:17; Ответить: locky-yotu
Сообщение #4


Alcorn, насколько мне известно, событие onload для картинки возвращает true по началу загрузки, а чтобы проверить её полную загрузку, надо проверять свойство complete.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Alcorn
Alcorn
сообщение 28.8.2010, 5:59; Ответить: Alcorn
Сообщение #5


(locky-yotun @ 28.8.2010, 01:17) *
Alcorn, насколько мне известно, событие onload для картинки возвращает true по началу загрузки, а чтобы проверить её полную загрузку, надо проверять свойство complete.


Как раз таки наоборот, onload срабатывает после загрузки изображения. Впринципе это можно проверить -
[PHP]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<script>
function xxx() {
var img=document.createElement('img');
img.src='1.jpg';
img.onload=function() {alert('xxx');}
document.getElementById('x').appendChild(img);
}
</script>
</head>
<body>
<div id="x"></div>
<input type="button" value="Create" onclick="xxx()">
</body>
</html>
[/PHP]
Для лучшего обзора скиньте этот код на хостинг и картинку потяжелее.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Alcorn
Alcorn
сообщение 28.8.2010, 6:04; Ответить: Alcorn
Сообщение #6


(RayOfLight @ 27.8.2010, 22:10) *
Alcorn, смотри, при наведении на маленькую картинку должен меняться бэкграунд у дива (большая картинка).
Мне нужно сделать, чтобы бэкграунд не менялся, пока не подгрузится большая картинка для него.
Не знаю как еще объяснить )


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

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Изображения с shutterstock от 15 рублей/штука
5 Mr_Big 3662 10.9.2017, 21:30
автор: Palundra
Открытая тема (нет новых ответов) Динамическая подгрузка на WP, оптимизация шаблона
Требуется знаток вордпресс
2 sergsg 1489 29.5.2017, 22:21
автор: sergsg
Открытая тема (нет новых ответов) Доработать сайт – подгрузка страниц при скроллинге
1 tvsm22 1489 31.3.2017, 11:27
автор: Alex_100
Открытая тема (нет новых ответов) Вывод изображения при наведения на часть картинки по area
1 androv77 4828 16.7.2016, 17:32
автор: -YroKPROG-
Открытая тема (нет новых ответов) Создаю фрактальные изображения для разных целей
22 Russ33 5064 27.6.2016, 21:42
автор: Russ33


 



RSS Текстовая версия Сейчас: 29.3.2024, 5:40
Дизайн