Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как сделать фоновую загрузку изображений? (https://javascript.ru/forum/misc/12614-kak-sdelat-fonovuyu-zagruzku-izobrazhenijj.html)

latter-day 26.10.2010 03:42

Как сделать фоновую загрузку изображений?
 
На странице сайта: http://m2project.ru/private/benilux.html есть простая листалка фото. Вот её код:

$(document).ready(function() {
   $(".slider_box img:first-child").addClass('last');
   $(".slide").click(function() {
       $(this).fadeOut('normal', function() {

          if ($(this).hasClass('last')) {
              $(".slide", $(this).parent()).css('z-index', 20);
          }
          else {
		      $(this).css('z-index', 19)
          }

          $(this).show();
       });
   });
});



Кусок из html:

<div class="slider_box"> 
         <img class="slide" src="http://www.m2project.ru/pic/private/700/10_benilux.jpg" alt="" /> 
         <img class="slide" src="http://www.m2project.ru/pic/private/700/09_benilux.jpg" alt="" /> 
         <img class="slide" src="http://www.m2project.ru/pic/private/700/08_benilux.jpg" alt="" /> 
         <img class="slide" src="http://www.m2project.ru/pic/private/700/07_benilux.jpg" alt="" /> 
         <img class="slide" src="http://www.m2project.ru/pic/private/700/06_benilux.jpg" alt="" /> 
         <img class="slide" src="http://www.m2project.ru/pic/private/700/05_benilux.jpg" alt="" /> 
         <img class="slide" src="http://www.m2project.ru/pic/private/700/04_benilux.jpg" alt="" /> 
         <img class="slide" src="http://www.m2project.ru/pic/private/700/03_benilux.jpg" alt="" /> 
         <img class="slide" src="http://www.m2project.ru/pic/private/700/02_benilux.jpg" alt="" /> 
         <img class="slide" src="http://www.m2project.ru/pic/private/700/01_benilux.jpg" alt="" /> 
      </div>



Можно ли как-то сделать так, чтобы картинки подгружались незаменто?
Проблема в том, что при открытии данной страницы видна загрузка этих картинок (быстрое мелькание).

Gvozd 26.10.2010 08:51

добавьте контейнеру .slider_box еще один класс, с dicplay:none, или аналогом, чтобы картинки не отображались
по событию window.onload, либо по завершении всех событий Onload картинок, снимите этот лишний класс.

latter-day 26.10.2010 08:58

Было бы классно, если б и с кодом помогли. Я яву, можно сказать, только начал осваивать. Пока вот готовые скрипты осваиваю)

DooMer 26.10.2010 10:38

latter-day,
если изучаете
тут посмотрите для начала

latter-day 26.10.2010 10:46

Я про JS)

monolithed 26.10.2010 11:07

Цитата:

Сообщение от latter-day
Можно ли как-то сделать так, чтобы картинки подгружались незаменто?
Проблема в том, что при открытии данной страницы видна загрузка этих картинок (быстрое мелькание).


используйте только один элемент IMG, а пути к файлам берите из массива

vladlen 26.10.2010 15:58

Gvozd, помоему при display:none картинки не грузяться. Хотя мож я и не прав.
Я бы выделил контейнер 0 высоты и туда их грузил, а потом бы менял ветви в DOM. Так точно работать будет
monolithed, а так придется еще и кэширование делать, чтоб все плавно робило.


Часовой пояс GMT +3, время: 00:19.