Вложенное изображение загрузки с jquery - PullRequest
1 голос
/ 09 марта 2010

Мне нужно загрузить 2 или более изображений за пределы экрана и отображать их с переходом только тогда, когда все они загружены.

У меня проблемы с загрузкой () Вот моя функция он показывает div с сообщением о загрузке, при загрузке img скрывает сообщение loadig и вызывает функцию с визуальным переходом (transizione ();)

 function load_img(sezione) {
  if (sezione==1)   {sfondo = "sfondo2.jpg"; footer = "footer1.jpg";} 
  else if (sezione==2) {sfondo = "sfondo3.jpg"; footer = "footer2.jpg";}
  else if (sezione==3) {sfondo = "sfondo4.jpg"; footer = "footer3.jpg";}
  else if (sezione==4) {sfondo = "sfondo5.jpg"; footer = "footer4.jpg";}

  $("#loading").fadeIn();

  $("#sfondo2").load(function () {
   $("#loading").hide();
   transizione();
     }).attr('src', 'img/'+sfondo);

 }

Как я могу изменить его, чтобы вызвать 2 изображения? Я немного запутался с тем, как load () работает с изображениями

Спасибо

Giuseppe

1 Ответ

1 голос
/ 09 марта 2010

Функция «load» для изображений используется для настройки обработчика событий. Другими словами, он позволяет вам предоставить функцию, которая будет вызываться после полной загрузки изображения.

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

var $images = $('#image1, #image2'), count = $images.length;
$images.load(function() {
  --count;
  if (count === 0) {
    // here the count is zero, so all images are ready
    transizione(); // ? whatever you want
  }
});

См? Это позволяет всем изображениям иметь один и тот же обработчик «загрузки», и он просто выполняет обратный отсчет до тех пор, пока все различные изображения не будут готовы (потому что число будет равно нулю).

Может быть, я не понял твоей необходимости здесь, Гусепо.

...