通过添加带有Jquery的类来触发CSS3过渡

Question

目前我有一个小提琴，我试图让css3不透明度转换为我添加一个类时触发。基本设置是我单击一个按钮，然后通过jquery我在dom中添加一个div，然后我将该元素添加到dom中，然后向其添加一个类。新的dom元素的添加类假设开始我的过渡，但事实并非如此，唯一发生的事情就是元素被显示但不透明度过渡不起作用。任何帮助将不胜感激，我将留下一个小提琴的链接 在这里fiddle link。是的，我知道我可以用jquery进行淡入淡出，但这只是一个实验，可能会用来开启除了不透明度之外的其他css过渡

Answer 1

之前我遇到过这个问题，我发现的唯一解决方法是添加一个setTimeout让DOM注意到有一个新元素。它可以是零毫秒，它仍然可以工作：

$('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/

Answer 2

我认为动态创建的元素尚不支持CSS3过渡。我尝试通过将div直接放在HTML中来修改您的示例，并且转换工作正常。在浏览器支持改进之前，您可能不得不将其作为一种解决方法。