jquery - jQuery 钟摆在 ie9 中不起作用

Question

我一直在看html5 和 jquery 中的钟摆，我在网站上找到了这个例子......

http://www.webdevdoor.com/javascript-ajax/jquery-pendulum-animation-pivot-point/

我在我的网站上嵌入了自定义，我已经阅读了这个文件，提到这在 Ie8 和旧版本的 firefox 和 safari 上不起作用，在将我的所有 UI 安排在一起之后，它在IE9中似乎是一个问题。 .

我不知道是什么，但这个例子不是我的演示......

例子：-

http://www.webdevdoor.com/demos/html5-pendulum-demo/

我的演示：-

http://jsfiddle.net/sZzy6/2/

截屏：-

我的 JS：-

$(document).ready(function(){
    var rotation = 7;
    var swingtime = 1603;
    var swinger = $('.pendulum-parent');

function init() {
            swinger.animate({rotate: rotation}, 0, function () {
                swinger.css("display", "block");
                rotation *= -1;
                pendulumswing1();
            });
}
function pendulumswing1() {
            swinger.animate({rotate: rotation},swingtime, "swing", function(){
                 rotation *= -1;
                 pendulumswing1();
            });
        }
init();

    });

以上有什么解决办法吗？我在哪里弄错了？还是它的操作系统或浏览器问题？

Answer 1

我不确定你是否已经解决了这个问题，但是 jsfiddle 和演示网站都可以在 IE9 中运行。我在 IE10 中运行它，但是浏览器模式应该完美地模拟 CSS 和 JavaScript 功能。这可能表明您的浏览器存在外部问题。

这里也是小提琴的轻微简化

$(function(){   

    var rotation = 7;
    var swingtime = 1603;
    var swinger = $('.pendulum-parent');
    swinger.css("display", "block");

    function pendulumSwing(first) {
        swinger.animate({rotate: rotation},swingtime, first? 0 : "swing", function(){
                 rotation *= -1;
                 pendulumSwing();
            });
        }
    pendulumSwing(true);

});

我们可以看到它确实有效的屏幕截图。

Answer 2

您的代码按照您提供的方式工作。

我正在使用带有 IE9 浏览器模式的 Internet Explorer 10，它运行良好。

这是钟摆工作的屏幕截图，只需单击“运行”选项：