动画在IE

失败我想创建一个jQuery插件，可以让我们在标记加起来入口和出口的动画。

我有入口动画在Chrome和Firefox的工作，但动画是由

animate({'top':posData.top+'px', 'left': posData.left+'px', 'opacity': 1}, speed)

或它的变体光盘（取决于执行他们有在IE7或IE8

没有影响在所需的方向上）。 posData正在记录到控制台，以便您可以查看可能的值。 speed设置在插件的开始处。

2012-02-07 Mild Fuzz

如果您有任何解决方案，请在此处发布。它会帮助其他面临同样问题的人。谢谢。 – 2012-02-08 04:08:01

以下回答我自己，希望它可以帮助别人。 – 2012-02-08 11:28:26

你也可以接受你的答案。 – 2012-02-08 11:30:51

这是一个组合，这些因素：

元素需要hasLayout
需要使用过滤器：alpha（opacity = 70）;为不透明度正常工作
Chrome似乎不喜欢data属性中的大写字母，这使得我在JavaScript中删除它们。 Chrome和Firefox都很满意，但IE强调这些情况相匹配，因此将HTML中的data-属性更改为小写字母，并确保它们的JS对应项匹配。

2012-02-08 11:27:52

+1有趣的学习 – 2012-02-08 11:30:10

IE8和IE7不支持CSS2 - opacity，您将需要filter: alpha(opacity=70);。请阅读更多详情here。

在你的jsFiddle中，你正在改变div的不透明度。由于IE8和IE7不支持opacity，您看不到任何动画。

编辑

入住这this职位上SO。它提到了解决问题的hasLayout。

希望这可以帮助你。

2012-02-07 13:07:25

你能解决这个问题，如果你不透明度与jQuery .css()设置为0：

$('.animate').anim().css({"opacity": 0});

jQuery是使用有问题的浏览器右侧不透明度滤光器。

或者你可以在CSS直接我想使用的过滤器，由阿马尔提到...（但随后的CSS验证失败）

2012-02-07 13:13:03 meo

没有好的，不透明度需要默认为0，没有JS。 :( – 2012-02-07 14:01:28

回答