Имеется страница... На ней имеется два изображения с весом по 4 мб. каждое.
При открытии страницы, пользователю должен показываться черный экран(закрывает основной сайт) с надписью "Подождите..." и только после загрузки двух этих изображений, черный экран должен исчезнуть.
Собственно суть вопроса вот в чем. Как отловить загрузку изображений?
Может использовать какую нибудь функцию, для загрузки изображений? Количество изображений может быть от 2 до 10.
и только после прогрузки ВСЕХ изображений, должно появиться содержимое сайта.
Полная Версия: загрузка изображения
40 метров страничка... ниче так...
Можно ничего не делать, т.к. никто не будет дожидаться окончания загрузки.
Черный экран... 5 секунд... черный экран.... закрыть окно.
По существу:
_____________
[продано копирайтерам]
Можно ничего не делать, т.к. никто не будет дожидаться окончания загрузки.
Черный экран... 5 секунд... черный экран.... закрыть окно.
По существу:
$(window).load(function () {
// все элементы страницы полностью загружены
});
_____________
[продано копирайтерам]
Ок. А вот допустим имеется массив изображение
var arr = ['1.png','2.png','3.png'];
Каким образом прогрузить все изображения из массива?
и тольк после этого показать страницу
var arr = ['1.png','2.png','3.png'];
Каким образом прогрузить все изображения из массива?
и тольк после этого показать страницу
.load() применима к любым элементам, имеющим ссылку на ресурс.
Как только ресурс по ссылке загружен, запустится callback
_____________
[продано копирайтерам]
Как только ресурс по ссылке загружен, запустится callback
_____________
[продано копирайтерам]
| Цитата (123456 @ 11.09.2015 - 18:17) |
| Имеется страница... На ней имеется два изображения с весом по 4 мб. каждое. |
Для начала, я думаю, надо оторвать руки и дизайнеру, и программисту
Чтобы не делали ТАКИХ больших картинок.Если это JPEG, то какие же размеры у него должны быть? Если же это BMP, то надо его упаковать.
Я предлагаю не искать окончание загрузки гигантских картинок, а переосмыслить задачу. Да и пользователя надо уважать, не тратить его трафик и нервы.
Если все-таки нужно загрузить большую картинку (даже если она меньше 4 МБ), то можно сделать так.
1. Нарисовать упрощенный вариант этой картинки, небольшого объема, с худо-бедно приемлемым качеством.
2. По окончании загрузки этой картинки начать грузить более качественную (и более объемную).
Пока будет выполняться п.2, юзер уже получит полноценную страницу, которую сможет читать. И в любом случае не надо его заставлять грузить такие картинки, которые по 4 МБ!!!
_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL
* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.
* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)
sergeiss
Суть вот в чем, пользователь заходит на страницу, на странице имеются все уменьшенные изображения в ТАК СЕБЕ качестве. После чего он может нажать на ссылку. На открывшейся странице должны отобразиться все те же изображения, но в идеальном качестве.
Суть вот в чем, пользователь заходит на страницу, на странице имеются все уменьшенные изображения в ТАК СЕБЕ качестве. После чего он может нажать на ссылку. На открывшейся странице должны отобразиться все те же изображения, но в идеальном качестве.
и надо дождаться загрузку всех изображений!
Т.к. изображения будут меняться при событиях. Клик, двойной клик, и т.д.
Если мы не прогрузим все изображения, а пользователь сделает клик, то ему придется ждать загрузки всего изображения, что в нашем случае не подходит.
Т.к. изображения будут меняться при событиях. Клик, двойной клик, и т.д.
Если мы не прогрузим все изображения, а пользователь сделает клик, то ему придется ждать загрузки всего изображения, что в нашем случае не подходит.
| Цитата (123456 @ 12.09.2015 - 07:29) |
| На открывшейся странице должны отобразиться все те же изображения, но в идеальном качестве. |
| Цитата (123456 @ 12.09.2015 - 07:32) |
| Если мы не прогрузим все изображения, а пользователь сделает клик, то ему придется ждать загрузки всего изображения, что в нашем случае не подходит. |
Как это сделать, тебе уже сказали (и я, и другие форумчане).
Но проблема в том, что у тебя изначально неправильное восприятие.
Есть уменьшенные копии картинок? Это хорошо!
А вот когда юзер кликает по картинке, то как раз в это время и надо начинать ее грузить. Заодно повесив визуальный индикатор загрузки, типа "крутилки". Который убираешь по окончании загрузки. И это будет самое правильное решение.
Если же немного помудрить, то можно сделать индикатор загрузки с процентами от размера. Будет и технически правильно, и юзер будет доволен.
_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL
* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.
* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)
Надо показать страницу именно после того, как все изображения будут загружены.
в моем случае, после отображения все должно работать моментально! Такая собственно цель... Подгружать во время просмотра - этот вариант в моем случае не подходит...
написал функцию, для загрузки изображений. После того, как все изображения будут загружены, отобразится необходимый блок сайта(В нашем случае спрячется верхний div с надписью "загрузка" )
в моем случае, после отображения все должно работать моментально! Такая собственно цель... Подгружать во время просмотра - этот вариант в моем случае не подходит...
написал функцию, для загрузки изображений. После того, как все изображения будут загружены, отобразится необходимый блок сайта(В нашем случае спрячется верхний div с надписью "загрузка" )
function imagesLoad(arr) {
var n = 0, i = arr.length - 1;
$.each(arr, function () {
$(new Image())
.attr('src', this)
.load(function() {
if (n++ == i)
$('#page').fadeOut(1000)
});
});
}
Здесь расположена полная версия этой страницы.