为什么这个jquery动画不像它应该的那样旋转?

时间:2013-01-03 06:58:00

标签: javascript jquery animation rotation jquery-animate

这个.js在fiddle

中完美运行
function animationLoop() {
    $("#ToBeAnimated").css({
        top: ($("#paperTrail").offset().top - parseInt($("#ToBeAnimated").height()) / 2),
        left: ($("#paperTrail").offset().left - parseInt($("#ToBeAnimated").width()) / 2)
    }).rotate(270);
    $("#ToBeAnimated").animate({
        top: $("#paperTrail").offset().top + $("#paperTrail").height() - $("#ToBeAnimated").height() / 2
      }, 1000, function() {
        $(this).animate({
            rotate: "180deg"
        }, function() {
            $("#ToBeAnimated").animate({
                left: $("#paperTrail").offset().left + $("#paperTrail").width() - $("#ToBeAnimated").width() / 2
            }, 1000, function() {
                $(this).animate({
                    rotate: "90deg"
                }, function() {
                    $("#ToBeAnimated").animate({
                        top: $("#paperTrail").offset().top - $("#ToBeAnimated").height() / 2
                    }, 1000, function() {
                        $(this).animate({
                            rotate: "0deg"
                        }, function() {
                            $("#ToBeAnimated").animate({
                                left: $("#ToBeAnimated").width() / 2
                            }, 1000, function() {
                                setTimeout(animationLoop, 1000);
                            });
                        });
                    });
                });

            });
        });
    });
}
animationLoop();​

但是在实际网站上,剪刀旋转不起作用或以某种方式破坏......我已经检查了......猜测并检查了......研究了可能的冲突......但我卡住了!也许我错过了一些明显的东西?

万分感谢您的帮助!...要在实际网站上观看动画,只需点击“Clip It !!!”即可。第一张优惠券底部的按钮!

extreme coupon network

更新:这与页面上有多个动画实例有关...当我查看页面with one result时,它对我有用......但是......我仍然无法制作它适用于页面上的许多项目(这是我真正追求的目标)....理想情况......无论您点击哪个优惠券都会在其上显示动画...目前,动画仅适用于第一张优惠券。 ..而且非常摇摇欲坠

再次感谢!

1 个答案:

答案 0 :(得分:0)

您正在测试的小提琴是使用jQuery版本1.8.2。但是,在您的网页上,您使用的是1.7.2版。如果你在1.7.2中改变你的jQuery版本,你会得到完全相同的错误行为(FF中的抖动动画,IE或Chrome中没有旋转)。

解决方案:更新您在项目中使用的jQuery版本!