模仿IE中的CSS3过渡？

Question

我使用的规则的组合来实现CSS3 transition的跨浏览器兼容的方式规则地:我使用transition,-webkit-transition,-moz-transition,和-o-transition.

-ms-transition任何版本的Internet Explorer 都有类似的属性吗？是否有旧版IE的专有过滤器,类似于IE 6-8中以下规则如何适用于不透明度？

/* IE 8 */ 
-ms-filter: "progid:DXImageTransform.Microsoft. Alpha(Opacity=50)"; 
/* IE 5-7 */ 
filter: alpha(opacity=50);

Answer 1

在旧版本的IE中没有任何过渡效果.

我知道接触它的唯一方法是使用JQuery fadeIn()和fadeOut()方法,它实际上可以在所有版本的IE中使用.

但是,我应该提醒他们,他们仍然会因IE的臭名昭着的不透明处理而受到谴责.当与IE6-8一起使用时,JQuery的淡入淡出效果会有一些奇怪的故障,特别是如果你正在淡化包含图形的块.

如果您决定尝试它,代码就变得简单了.只需在标题中包含JQuery,然后:

$('#myelement').fadeIn();

在适当的地方.

有关详细信息,请参阅JQuery FadeIn手册页.

当然,这将取代任何CSS过渡效果; 这一切都是通过Javascript完成的,你可能需要丢弃你的CSS3过渡,否则它会与JQuery效果冲突.但是,如果你想让它与IE一起工作,那就是你付出的代价.

就像我说的那样,留意这些故障.测试它,看看它是如何找到你的.

这是唯一的方法,所以如果你真的需要IE中的过渡效果,那就是你需要做的,但要准备接受它可能看起来不那么好.

其他Javascript库,如Mootools或Dojo可能会有类似的效果,你也可以尝试,但我想如果他们确实有它,他们会遇到同样的问题.

Answer 2

我还找到了一个名为move.js的库,它可以与CSS3转换一起使用:https://github.com/visionmedia/move.js

希望这可以帮助.