0

最初の 2 つのリンクは動作中の回転アイコンを示していますが、動作させたい 3 番目のリンクは正しく動作しません...

https://jsfiddle.net/752tfqyu/17/

私が作成した JSfiddle は動作します。JSfiddle 内のすべてのコンテンツを取得してサーバーでテストしたとき: 動作しません: http://cdubach.com/inc/test.php

http://cdubach.com/pages/home/index.php 問題があるところ、アイコンが回転しません。

アイコンを回転させるために使用されるメインの Javascript/Jquery。

/* [(START)Rotate Icon:SCroll Down] ----------------> */

$(document).ready(function() {
  $(window).scroll(function() {
    if ($(window).scrollTop() < 300) {
      $("#rotate").css({
        "top": $(window).scrollTop() + "px"
      });
    }
  });
});
/* [(END)Rotate Icon:SCroll Down] ------------------> */

var looper;
var degrees = 0;

function rotateAnimation(el, speed) {
  var elem = document.getElementById(el);
  if (navigator.userAgent.match("Chrome")) {
    elem.style.webkitTransform = "\"rotate(" + degrees + "deg)\"";
  } else {
    elem.style.transform = "\"rotate(" + degrees + "deg)\"";
  }

  looper = setTimeout('rotateAnimation(\'' + el + '\',' + speed + ')', speed);
  degrees++;
  if (degrees > 359) {
    degrees = 1;
  }
}
4

1 に答える 1

0

あなたのフィドルとあなたが投稿したコードを比較して、問題と思われるものを見つけました。

WebKitTransForm でいくつかの二重引用符をエスケープしようとしているようですが、その理由は完全にはわかりませんが、元に戻すと機能します。

これが機能するコードペンです：

var looper;
var degrees = 0;
function rotateAnimation(el, speed) {
  var elem = document.getElementById(el);
  if (navigator.userAgent.match("Chrome")){
    elem.style.WebkitTransform = "rotate("+degrees+"deg)";
  } else {
    elem.style.transform = "rotate("+degrees+"deg)";
  }
  looper = setTimeout('rotateAnimation(\''+el+'\','+speed+')',speed);
  degrees++;
  if (degrees > 359) {
    degrees= 1;
  }

}
于 2016-03-22T18:10:54.787 に答える