5

我正在寻找一个 CSS3 动画来工作；在所有主要浏览器中都可以正常工作，但 IE9 和更早版本（这并不奇怪）。所以不用多说，这里是 CSS ：

#grosse_photo {
    /*...*/
    -webkit-animation: photoFade 12s infinite;
    -moz-animation:photoFade 12s infinite;
    -ms-animation: photoFade 12s infinite;
    animation-iteration-count:1;
    -moz-animation-iteration-count:1;
    -webkit-animation-iteration-count:1;
    -o-animation-iteration-count:1;
}
    @-webkit-keyframes photoFade {
        0%   { opacity: 0.0; }
        100% { opacity: 1.0; }
    }
    @-moz-keyframes photoFade {
        0%   { opacity: 0.0; }
        100% { opacity: 1.0; }
    }
    @-o-keyframes photoFade {
        0%   { opacity: 0.0; }
        100% { opacity: 1.0; }
    }
    @keyframes photoFadee {
        0%   { opacity: 0.0; }
        100% { opacity: 1.0; }
    }

我使用-ms前缀认为它会做出反应-webkit，但显然 IE (lte 9) 没有合作。

我还需要滑入的元素，但由于 IE 不会合作，我想我忘记了除modernizr之外的一个明显的 polyfill 。

虽然不是最佳的，但我已经看到很多参考 jQuery 替代品，尽管我仍在寻找一个片段，它允许在不同的时间和速度下实现不同的动画。

4

2 回答 2

2

我不认为动画有直接的polyfill，你不会通过javascript引入动画命令。

为此你可以去 jquery animate()，或者你可以试试这个，更新的： http ://www.polymer-project.org/platform/web-animations.html

如果您需要过渡回退的东西，您可以尝试： https ://github.com/addyosmani/css3-transition-fallbacks

于 2013-09-27T04:48:12.820 回答
0

IExplorer 没有 opacity 选项，它有
filter:alpha(opacity=77);
这与 IE 的兼容性基本相同

于 2014-01-08T07:54:53.860 回答