javascript在MSIE、Safari、Opera中不起作用；在FF、Chrome工作；如何改用jQuery？

我不熟悉编写javascript，也不熟悉jQuery。我试图让这些（3）图片在身体负荷时翻滚到页面顶部。它可以在FF和Chrome中正常工作，但在MSIE、Safari和Opera中根本不起作用。我不知道如何在这里包含我的html或css。网站是drumweedcolorado.com

这是javaScript，下面是html

 //external js file

   function slideIn(el){
         var elem = document.getElementById(el);
          elem.style.transition = "left 5.0s ease-in 0s";
           elem.style.left = "950px";
            }
    function slideOver(el){
         var elem = document.getElementById(el);
          elem.style.transition = "left 5.0s ease-in 0.7s";
           elem.style.left = "950px";
            }
    function slideRight(el){
         var elem = document.getElementById(el);
          elem.style.transition = "left 5.0s ease-in 2.5s";
           elem.style.left = "950px";
            }

    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 if(navigator.userAgent.match("Firefox")){
        elem.style.MozTransform = "rotate("+degrees+"deg)";
        } else if(navigator.userAgent.match("MSIE")){
        elem.style.msTransform = "rotate("+degrees+"deg)";
        } else if(navigator.userAgent.match("Opera")){
        elem.style.OTransform = "rotate("+degrees+"deg)";
        } else if(navigator.userAgent.match("Safari")){
        elem.style.AppleWebKitTransform = "rotate("+degrees+"deg)";
        } else {
        elem.style.transform = "rotate("+degrees+"deg)";
    }
    looper = setTimeout('rotateAnimation(\''+el+'\','+speed+')',speed);
    degrees++;
    if(degrees > 359){
    degrees = 1;
    }
    }

---

供应商前缀不是永久性的，因此Chrome不会总是使用

WebKittTransform

与浏览器嗅探相比，使用功能检测可以更好地为您提供服务，通过它可以确定适当的属性名称：

if ('transform' in elem.style) {
    elem.style.transform = "rotate("+degrees+"deg)";
} else if ('webkitTransform' in elem.style) {
    elem.style.webkitTransform = "rotate("+degrees+"deg)";
} // etc.

但是，您也可以将CSS属性名称用于：

---

不使用浏览器检测？当前的浏览器版本都支持

style.transform

，只有在不支持的情况下才需要使用供应商前缀。我尝试了（功能检测）建议，但结果相同。然后我尝试了CSS setProperty建议，根本没有旋转。即使我能让IE和Safari（我客户的浏览器）正常工作，那也太好了。还有其他建议吗？

function rotateAnimation(el,speed){
    var elem = document.getElementById(el);
    var transform = "rotate("+degrees+"deg)";

    elem.style.setProperty('-webkit-transform', transform);
    elem.style.setProperty('-moz-transform', transform);
    elem.style.setProperty('-ms-transform', transform);
    elem.style.setProperty('-o-transform', transform);
    elem.style.setProperty('transform', transform);

    // ...
}