Facebook 分享按钮在 IE11 中破坏 CSS 动画答案

【问题标题】：Facebook share button breaking CSS animations in IE11Facebook 分享按钮在 IE11 中破坏 CSS 动画
【发布时间】：2014-03-10 00:34:54
【问题描述】：

这个问题最近几周才开始出现，所以它可能与 IE11 更新或 FB 小部件的更改有关。

我的网站上有一个 FB 分享按钮。

<script>
    (function (d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s);
        js.id = id;
        js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>

在文档头部，<div id="fb-root"></div> 和 <div class="fb-share-button" data-href="http://myurl.com" data-width="60" data-type="button"></div> 在正文中。

它在 Chrome、Firefox、Safari 和 IE10（以及打开 IE10 仿真的 IE11）中运行良好。但在 IE11 中，某些 CSS 动画停止工作。样式表中默认设置的动画有效，但通过 :hover 触发的动画以及 jQuery 添加的内联 CSS 将无法播放。

我可以确认其他 :hover 效果仍然有效，并且通过 jQuery 设置内联（非动画）样式也有效。出于某种原因，这只是动画。我也尝试过为各种不同的属性设置动画，但它们都不起作用。

如果我从文档头部删除 Facebook 脚本，动画就会重新开始工作。

有没有其他人遇到过这种情况或知道为什么会发生这种情况？

注意：这是在 IE v11.0.9600.16428, Win7 x64 上

【问题讨论】：

标签： facebook css-animations internet-explorer-11

【解决方案1】：

我刚刚发布了一个非常相似的问题，然后找到了解决方案。我想知道这是否对你有用。在Loading Facebook SDK in IE11 breaks CSS animations查看答案

【讨论】：