wordpress中的jquery动画

Question

我为我的网站徽标制作了动画，代码在 jsfiddle 中运行良好，但是当我将其上传到 wordpress 时，我的一个功能（动画）似乎无法正常工作（图片没有向左和向上移动），而其他（旋转）工作正常。这是我的代码：http://jsfiddle.net/5nwdjbp6/

(function rotation() {


$({deg: 325}).animate({deg: 345}, {
    duration: 1200,
    step: function(now){
        $('.random').css({
             transform: "rotate(" + now + "deg)"
        });
    }
}).animate({deg: 325}, $.extend(true, {}, {
    duration: 2000,
    step: function(now){
        $('.random').css({
             transform: "rotate(" + now + "deg)"
            });
        }}, {
        complete: function() {
           rotation();
        }
     })
 );
})();




(function animation() {

   $('.random').animate({
            left: "130px",
            top: "105px",
         },
         {
        duration: 1200,

   }
      )
      .animate({
            left: "90px",
          top: "90px",
         },
         $.extend(true, {}, {
      duration: 2000,

      }, {
        complete: function() {
           animation();
        }
     })
  );
})();

有什么想法吗？

Answer 1

"position is relative in wp and that div is also placed in bootstrap column" - 这就是问题所在。您不能将top 和left 用于相对定位的元素，而是使用margin-top 和margin-left。当你切换它时，它应该和小提琴中的一样工作。