Как отображать загрузчик, пока не будут отображаться изображения?

Question

0

У меня есть галерея, структура эскиза выглядит так:

<div style="background-image: _URL_FOR_THE_IMAGE;">
  <div class="ajax_loader"></div>
</div>

и JS:

$(window).load(function() {
  $(".ajax_loader").fadeOut("slow");
})

Но проблема в том, что загрузчик никогда не исчезнет.

Как заставить его работать?

спасибо

user984621 02 март 2014, в 18:58

0

Вы включили JQuery?
adeneo 02 март 2014, в 17:56
0

И вы тестируете это не в jsFiddle, а на реальном сайте, где запускается window.onload.
adeneo 02 март 2014, в 17:56
0

Да, JQuery правильно включен. И да.
user984621 02 март 2014, в 17:57
0

alert(1) в onload ? Что-то происходит?
leaf 02 март 2014, в 17:59
0

Попробуйте родным способом, window.onload = function() { $(".ajax_loader").fadeOut("slow"); }
adeneo 02 март 2014, в 18:01
0

jsfiddle.net/S2fdS перепроверьте все.
dfsq 02 март 2014, в 18:07

Показать ещё 4 комментария

Теги:

image

1 ответ

И вы тестируете это не в jsFiddle, а на реальном сайте, где запускается window.onload.
Попробуйте родным способом, window.onload = function() { $(".ajax_loader").fadeOut("slow"); }

Luoruize · Answer 1 · 2014-03-02T16-03-00.000Z

Вы можете использовать класс Image так:

var img = new Image();
img.onload = function() {
    // code to remove loader and display image
}
img.src = IMAGE_URL;

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