Javascript IE8/9 中的 CSS3 动画
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10854761/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS3 Animation in IE8/9
提问by Michael Bulpitt
I understand that CSS3 animations do not work in IE. I was just wondering if there is a JavaScript workaround for this problem.
我知道 CSS3 动画在 IE 中不起作用。我只是想知道是否有针对此问题的 JavaScript 解决方法。
Here's a link to what I want to recreate in IE: http://animation.kashoo.co.uk/
这是我想在 IE 中重新创建的内容的链接：http: //animation.kashoo.co.uk/
Any advice would be great.
任何建议都会很棒。
回答by Martin
After a quick Google search I found a jQuery plugin that changes jQuery's standard $.animate() function so that it will use CSS3 transitions whenever possible:
在快速谷歌搜索后，我发现了一个 jQuery 插件，它改变了 jQuery 的标准 $.animate() 函数，以便它尽可能使用 CSS3 转换：
edit:
编辑：
After trying the above plugin on a site of mine, the site broke. I'm not sure if you will have the same problem or not, but here is my workaround:
在我的网站上尝试了上述插件后，该网站崩溃了。我不确定您是否会遇到同样的问题，但这是我的解决方法：
You will need Modernizr.js
您将需要Modernizr.js
Basically, you check (with Modernizr) whether the browser supports a given feature, and then decide whether to animate with CSS3 or Javascript.
基本上，您（使用 Modernizr）检查浏览器是否支持给定的功能，然后决定是否使用 CSS3 或 Javascript 制作动画。
For example:
例如：
(Let's say you are animation an object to move to the right by 200px)
（假设您正在动画一个对象向右移动 200 像素）
if(Modernizr.csstransitions) {
// use your appropriate browser prefixes
yourDomObject.style.transition = 'left 2s';
yourDomObject.style.left = parseInt(yourDomObject.style.left) + 200 + 'px'
} else {
var left = parseInt($(yourDomObject).css('left')) + 200 + 'px';
$(yourDomObject).animate({
'left' : left
},2000,'easeOutExpo');
}
回答by Josh Siok
Check out jQuery's animate functions: http://api.jquery.com/animate/
查看 jQuery 的动画函数：http: //api.jquery.com/animate/
回答by sachleen
There are many JQuery plugins that provide animations. Here's one that has a flip effect similar to the one you are looking for. http://lab.smashup.it/flip/
有许多提供动画的 JQuery 插件。这是一种具有类似于您正在寻找的翻转效果的翻转效果。http://lab.smashup.it/flip/
