Блог

Итак, вот мой рабочий код на данный момент…

 $(window).load(function() {
     $("#scroller li").each(function(i) {
          $(this).delay(400*i).fadeIn();
     });
});
  

После загрузки окна оно исчезает в одном изображении за другим, идеально. Но на моей странице у меня есть ссылки, которые вызывают html-файл, содержащий больше изображений в div. Этот скрипт просто затухает изображения одно за другим во время их загрузки, в результате чего половина обрезанных изображений исчезает…

Итак, я хочу, чтобы, когда документ готов, он загружал все изображения, а затем добавлял их.

Мне нужно использовать jQuery(document).ready(function() для запуска скрипта, поэтому a .bind('load') в порядке… Я думаю.. Я довольно новичок в этом…

Это то, что я придумал, но это не работает.. Может быть, кто-нибудь может сказать мне, почему…

 $(document).ready(function() {
     $("#scroller li").each(function(i) {
          $(this).bind('load', function(){
               $(this).delay(400*i).fadeIn();
          });
      });
  });
  

загрузка уже произошла с $(document).ready ожидает загрузки всего содержимого страницы, прежде чем запустить функцию.

вы пробовали запускать li или li как скрытые, а затем просто делать это:

 $(document).ready(function() {
     $("#scroller li").each(function(i) {
           $(this).delay(400*i).fadeIn();
      });
  });
  

Похоже, вы хотите предварительно загрузить изображения. Если изображения предварительно загружены, они будут кэшироваться, поэтому при их первом отображении все изображение должно отображаться, а не обрезаться. Вы можете предварительно загрузить изображения, просто используя `$ («»).attr (‘src’, ‘source / of / image’); Это загружает изображения в память и должно кэшировать их заранее. Он не будет добавлять их в DOM.