.scrollLeft() is _very_ slow on Safari(Windows) and IE

.scrollLeft() is _very_ slow on Safari(Windows) and IE

Hi,
I'm trying to build a scroller that scrolls continuously both left and right. or actually someone made it for me, because I wanted to use SerialScroll for this purpose, but I didn't manage to do so.. (So if anyone know how to do it, please help!)

However.. in Safari (only in windows) and IE the scrolling is slow..  but in Opera, Chrome and Firefox + Safari(Mac) it works great..
How come?
  1. <html>
    <head>
     
    <script type='text/javascript' src='jquery.js'></script> 
     
    <style>
    li
    {
       list
    -style:none outside none;
       
    float:left;
    }
    </style>
    </head>
    <body>
     
    <div style="width:500px;"> 
      
    <div id="buttons"> 
       
    <a class="prev" href="#" onmousedown="previous();start()" onmouseup="stop()">Previous</a> 
       
    <a class="next" href="#" onmousedown="next();start()" onmouseup="stop()">Next</a> 
       
    <br class="clear" /> 
      
    </div> 
      
    <div id="pane" style="overflow:hidden;"> 
       
    <ul style="width:2000px"> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
        
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
       
    </ul> 
      
    </div> 
     
    </div> 


    <script>

    interval

    =20;
    speed
    =3;
    change 
    = 1;
    handleTimeOut 
    = null;


    function next(){
     change 
    = 1;
    }




    function previous(){
     change 
    = -1;
    }


    function start(){
     handleTimeOut 
    =setTimeout(function(){timeout()},interval);
    }


    function stop(){
     clearTimeout
    (handleTimeOut);
    }


    function timeout() {
     $
    ('#pane')[0].scrollLeft += speed*change;
     start
    ();
    }


    </script>
    </body>

Thanks in advance!
Best regards,
Anders