переключение изображений с помощью jquery

#javascript #jquery #css

#javascript #jquery #css

Вопрос:

я не могу заставить следующий код работать:

 $('#clicked_package').css({"background-image" : "url(img/head_2.png)"}).fadeOut("slow");
$('#clicked_package').css({"background-image" : "url(img/head_2_normal.png)"}).fadeIn("slow");
  

Независимо от того, какое изображение я помещаю в первую строку, кажется, что оно всегда заменяет его второй строкой. Итак, мое первое изображение такое же, как и второе изображение.

Я хочу, чтобы первое изображение исчезло, а затем исчезло во втором изображении.

предложения? Спасибо

Ответ №1:

Вероятно, вам нужна версия fadeOut , которая принимает функцию обратного вызова:

 $('#clicked_package')
    .css({"background-image" : "url(img/head_2.png)"})
    .fadeOut("slow", function () {
        $(this).css({"background-image" : "url(img/head_2_normal.png)"})
            .fadeIn("slow");
});
  

Пример: http://jsfiddle.net/andrewwhitaker/VLRKy/