图像平移JavaScript不适用于Chrome

Question

我使用了一个JavaScript，在网站的主页标题中移动大背景图像以实现简单动画。该脚本在Mozilla和IE中运行正常，但不知何故Chrome浏览器不工作。请参阅以下内容：

 var scrollSpeed = 70;  // Speed in milliseconds 
     var step = 1;    // How many pixels to move per step 
     var left = 0; 
     var top = 0;   // The current pixel row 
     var imageHeight = 718;  // Background image height 
     var headerHeight = 376;  // How tall the header is. 

     //The pixel row where to start a new loop 
     var restartPosition = -(imageHeight - headerHeight); 

     function scrollBg(){ 

      //Go to next pixel row. 
      left -= step; 
      top -= step; 

      //If at the end of the image, then go to the top. 
      if (top == restartPosition){ 
       top += step 
      } 

      //Set the CSS of the header. 
      $('#slideshow').css("background-position",left+"px"+" "+top+"px"); 
     } 
     //Calls the scrolling function repeatedly 
     var init = setInterval("scrollBg()", scrollSpeed); 

我正在使用jquery 1.4.3。 html如下：

<div class="banner"> 
         <div id="slideshow"></div> 
        </div> 

真的很感激，如果有人能指出我在做什么错在这里。

Answer 1

好吧，我想通了。我只需将整个脚本包装在$（document）.ready中并开始工作。最终的脚本如下：

$(document).ready(function() { 
     var scrollSpeed = 80;  // Speed in milliseconds 
     var step = 1;    // How many pixels to move per step 
     var left = 0; 
     var top = 0;   // The current pixel row 
     var imageHeight = 718;  // Background image height 
     var headerHeight = 376;  // How tall the header is. 

     //The pixel row where to start a new loop 
     var restartPosition = -(imageHeight - headerHeight); 

     function scrollBg(){ 

      //Go to next pixel row. 
      left -= step; 
      top -= step; 

      //If at the end of the image, then go to the top. 
      if (top == restartPosition){ 
       top += step 
      } 

      //Set the CSS of the header. 
      $('#slideshow').css("background-position",left+"px"+" "+top+"px"); 
     } 
     //Calls the scrolling function repeatedly 
     setInterval(scrollBg, scrollSpeed); 
    });