Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   показать класс после загрузки изображения (https://javascript.ru/forum/jquery/22857-pokazat-klass-posle-zagruzki-izobrazheniya.html)

malkoff 03.11.2011 10:08

показать класс после загрузки изображения
 
Всем привет
Есть задача. Загружается анимированая гифка (порядка 600кб).
Сверху на нее при помощи position: absolute добавляются кнопки (класс .button)
Нужно сделать так чтобы .button появился плавно после полной загрузки анимированой гифки

пробовал так
$(document).ready(function() {

 $(".buttons").css("display", "none");
   $(".buttons").fadeIn(2500);
});


но кнопки появляются раньше чем догрузится гифка
в чем дело?

спасибо заранее

ksa 03.11.2011 11:37

Цитата:

Сообщение от malkoff
в чем дело?

Событие redy наступает раньше чем загрузится твой "гифка"... Как вариант используй событие load самой "гифки"...

malkoff 03.11.2011 14:55

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

MadGest 05.11.2011 23:23

$('#image').attr('src', 'image.jpg').load(function() {  
    alert('Картинка загружена');  
});


attr можно убрать, это так для наглядности.

trikadin 06.11.2011 01:01

MadGest, плохой вариант. Теоретически, возможна ситуация, когда картинка загрузится (и, соответственно, обработчик load выполнится) раньше, чем вы этот пресловутый обработчик повесите (например, такие вещи на ура происходят, если картинка в кэше).

Так что так:
$('#image').load(function() { 
    alert('Картинка загружена'); 
}).attr('src', 'image.jpg');


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