@Nickola23

Как выполнить полную загрузку изображений с последующим выполнением скрипта?

Здравствуйте.

Ситуация следующая.

1. При помощи скрипта в существующий div на странице подгружается заранее подготовленные несколько div'ов со ссылками на картинки.
2. Далее этот набор div'ов плагин turn.js визуализирует в виде книги с эффектом листания страниц.

Чтобы все корректно работало необходимо, чтобы все изображения (страницы книги) начали грузиться, этого не происходит, т.к. скрипт turn.js выполняется раньше. Посоветуйте пожалуйста, что можно сделать.

.onload() не помогает.

Спасибо за помощь.
  • Вопрос задан
  • 2244 просмотра
Пригласить эксперта
Ответы на вопрос 5
Petroveg
@Petroveg
Миром правят маленькие с#@&ки
Как я понимаю, код подгружается с помощью AJAX?
Тогда механика проста:

1. Вставляем загруженный код, находим все изображения и пишем в счётчик их количество.
2. Проходим по ним циклом и проверяем readyState.
3. Если он равен complete, то уменьшаем счётчик на 1.
4. Если нет, то вешаем обработчик на load, в котором уменьшаем счётчик на 1.
5. Если счётчик стал равным 0, запускаем Берлагу.

Примерно так:

$.ajax({
	url: '...'
}).done(function (data) {
	var count;

	$('.target').append(data).find('img').each(function () {
		if (this.readyState != 'complete') {
			count++;
			$(this).on('load', checkCount);
		}
	});

	function checkCount () {
		count--;

		if (count == 0) {
			// Вперёд, к звёздам
		}
	}
}).fail(function () {
	// Про ошибки помним
});
Ответ написан
Комментировать
shpaker
@shpaker
Вольный хлебопашец
Надо писать прелоудер картинок, как выше уже писали, или воспользоваться чем-то готовым, например pxloader.
Ответ написан
Думаю надо вызывать инициализацию turn.js не в онлоаде документа, а в онлоаде Ваших подгружаемых div`ов.
Ответ написан
Комментировать
@bromzh
Drugs-driven development
jquery when, например.
Ответ написан
Комментировать
VovanR
@VovanR
Фронт-энд Вэб-разработчик
Еще есть популярный imagesloaded
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы