如何将CSS样式应用于jQuery效果

Question

我有一个包含列表的页面。我有一个按钮可以将新项目添加到列表中。我想将JQuery-UI效果应用到添加新项目，我的问题是当显示效果动画时，列表项目不是样式。看到这个小提琴 - http://jsfiddle.net/Ec3x9/2/。

您可以看到，当用户点击创建按钮时，会显示该项目的动画，但由于未应用CSS，列表项文本位于该图标下。我想显示列表项目的动画。我怎么做？

Answer 1

在您的CSS声明中删除ul和li之间的>字符。 jquery在做动画之前用div元素包装你的li。当发生这种情况时，li不再是ul的直接后代，因此您的样式在动画过程中不会被应用。

例：http://jsfiddle.net/Ec3x9/8/

Answer 2

它看起来像样式不正确的IE 7在FF和Chrome的工作文字旁边的图像图标显示。对于IE你可以删除line-height或将其设置为0它应该工作。

给一个去看看它是否修复你的问题。但是，这将打破FF和Chrome的样式。所以你将不得不添加一些智慧来使IE 7和Chrome/FF的设计工作。