JQuery

Question

ile bir sınıf ekleyerek bir CSS3 Transition'ı tetikleme Şu anda bir sınıf eklediğimde css3 opacity geçişini başlatmaya çalıştığım çalışan bir keman var. Temel kurulum, bir düğmeyi tıklayıp jQuery ile dom'a bir div ekliyorum ve bu elemanı dom'a ekledikten sonra ona bir sınıf ekliyorum. Bu yeni dom elemanına eklenen sınıfın benim geçişimi başlattığını varsayalım, ama bu gerçekleşmiyor, tek olan şey elementin gösteriliyor olması ama opaklık geçişinin çalışmadığı. Herhangi bir yardım çok takdir edilecektir, ben burada fiddle link keman için bir bağlantı bırakıyorum. Ve evet sadece jquery ile fade yapabilirdi biliyorum, ama bu muhtemelen sadece css diğer css başlatmak için kullanılacak bir deney olduğunu diğer geçişler opaklık

Answer 1

CSS3 geçişlerinin henüz dinamik olarak oluşturulmuş öğelerde desteklendiğini sanmıyorum. Numunenizi div doğrudan HTML'ye yerleştirerek değiştirmeyi denedim ve geçişler iyi çalıştı. Tarayıcı desteği geliştirilinceye kadar bir geçici çözüm olarak bununla yaşamak zorunda kalabilirsiniz.

Answer 2

Daha önce bu sorunla karşılaştım, bulduğum geçici çözüm, DOM'ın yeni bir öğe olduğunu bildirmesine izin vermek için bir setTimeout eklenmesi. Sıfır msn olabilir ve çalışmaya devam eder: Sınıf önceden tanımlanmış olup olmadığı aslında sadece görünüyor

$('button').live('click', function() { 
    $(this).after("<div class='fade'>This is just a test</div>") 
    setTimeout(function(){$(".fade").addClass("in");}, 0) 
}); 

http://jsfiddle.net/tfmFx/