0

前两个链接显示一个工作的旋转图标,但我希望它工作的第三个链接将无法正常工作......

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 回答