jQuery анимация эффект затухания

Question

Эффект затухания здесь не работает .... ui.fadebox - это белый тег div, который должен исчезать и исчезать. Однако он не исчезает, даже когда время установлено на 5000, это похоже на настройку отображения из блока/none. Там нет ... Переход

  ui.fadeBox.animate({ 
        opacity: 1 
       }, 
       500, 
       function() { 
        $('.active', ui.container).removeClass('active'); 

        $(ui.banners[idx]).addClass('active'); 

        ui.fadeBox.animate({ 
         opacity: 1 
        }, 
        500, 
        function() { 
         ui.fadeBox.css("display", "none"); 
        }); 
      }); 

Answer 1

Вы никогда не установите непрозрачность 0. Вы только когда-либо анимировать 1.

Другими словами, вы оживляющий с непрозрачностью 1-> 1, а затем половину второй более поздний анимирующий из 1-> 1, а затем через полсекунды, заставляя его исчезнуть. Таким образом, он остается видимым в течение 1 секунды, а затем он мигает.

Вам нужно сделать второй непрозрачности 0, и сделать его начать с 0.

упрощенный пример:

http://jsfiddle.net/ZYmHP/

Другой:

http://jsfiddle.net/ZYmHP/1/

Answer 2

Чтобы сделать это затухайте, установите непрозрачность до 0 перед анимацией.
(Называя ui.fadebox.css('opacity', 0))

Чтобы сделать это исчезать, менять внутреннюю opacity: 1 в 0.