.fadeOut() all'interno di un elemento nascosto - possibile bug?

Question

Data la following code:

<div class='hotel_photo_select'> 
    Hello 
</div> 

<div class='itsHidden' style='display:none'> 
    <div class='hotel_photo_select'> 
     Hello 
    </div> 
</div> 

E:

$('.hotel_photo_select').fadeOut(300); 
$('.itsHidden').show(); 

mi si aspetterebbe entrambe .hotel_photo_select div da nascondere. Tuttavia, il secondo non è nascosto quando mostro il contenitore.

Si tratta di un bug jQuery? Ogni elemento dovrebbe diventare nascosto dopo fadeOut().

L'unica soluzione che credo sarà questo:

$('.hotel_photo_select').fadeOut(300, function() { 
    $(this).hide(); 
}); 
$('.itsHidden').show(); 

Il che sembra di essere meno elegante.

Answer 1

Tecnicamente, per questo tipo di metodo è necessario utilizzare '.ogni()'. Quindi, consente anche di aggiungere un punto di controllo, dove determiniamo se il genitore è visibile, se non è visibile, quindi lo rendiamo visibile.

Tuttavia, rendere visibile il genitore, potrebbe avere un effetto negativo sul layout, SÌ. Ma non esiste un modo migliore per farlo, e quindi è necessario evitare questi tipi di situazioni.

vivo esempio: http://jsfiddle.net/QMSzg/21/

$('.hotel_photo_select').each(function() { 
    var this_parent = $(this).parent('div'); 
    if (this_parent.is(':hidden')) { 
     this_parent.show(); 
    } 
    $(this).fadeOut(500); 
}); 

Answer 2

jQuery.fadeOut trasforma gli elementi dallo stato corrente allo stato che si desidera adottare, in questo caso nascosto. Se l'elemento è già nascosto (come nel caso della seconda occorrenza), jQuery non ha bisogno di eseguire alcuna azione. Che cosa si potrebbe fare è specificamente impostato il display css a nessuno:

$('.itsHidden .hotel_photo_select').css('display','none'); 

Answer 3

come "Boo" già citato, in quanto lo stato attuale della seconda "ciao" div è non si applica "nascosto" jQuery.fadeOut() qualsiasi animazione su di esso.

Invece di dire "sbiadiscilo per me", devi dire "animare l'opacità a 0". In questo caso jQuery non si preoccuperà se il tuo elemento è visibile o meno. farà il suo lavoro:

$('.hotel_photo_select').animate({opacity:0}, 3000); 

vedono qui: http://jsfiddle.net/QMSzg/20/

Answer 4

luogo lo spettacolo() prima della dissolvenza()

$('.itsHidden').show(); 
$('.hotel_photo_select').fadeOut(300); 

Answer 5

ho avuto lo stesso problema. La mia soluzione era quella di nascondere l'elemento come una funzione chiamata indietro:

$('.hotel_photo_select').fadeOut(300, function(){ 
    $('.hotel_photo_select').hide(); 
}); 

In questo modo se l'elemento è nascosto, la chiamata sarà chiamato subito.