title: Add autoscroll to jquery slider
body: <p>I have this jQuery slider but, now I need to make it to automatically start sliding on the beginning. For now it only does on click sliding to the left or the right. Can anybody help me how to do that?</p>
  
  <pre><code>&lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(document).ready(function(){
    var currentPosition = 0;
    var slideWidth = 960;
    var slides = $('.slide');
    var numberOfSlides = slides.length;
  
    // Remove scrollbar in JS
    $('#slidesContainer').css('overflow', 'hidden');
  
    // Wrap all .slides with #slideInner div
    slides
      .wrapAll('&lt;div id="slideInner"&gt;&lt;/div&gt;')
      // Float left to display horizontally, readjust .slides width
      .css({
        'float' : 'left',
        'width' : slideWidth
      });
  
    // Set #slideInner width equal to total width of all slides
    $('#slideInner').css('width', slideWidth * numberOfSlides);
  
    // Insert controls in the DOM
    $('#slideshow')
      .prepend('&lt;span class="control" id="leftControl"&gt;Кликни за лево&lt;/span&gt;')
      .append('&lt;span class="control" id="rightControl"&gt;Кликни за десно&lt;/span&gt;');
  
    // Hide left arrow control on first load
    manageControls(currentPosition);
  
    // Create event listeners for .controls clicks
    $('.control')
      .bind('click', function(){
      // Determine new position
      currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
  
      // Hide / show controls
      manageControls(currentPosition);
      // Move slideInner using margin-left
      $('#slideInner').animate({
        'marginLeft' : slideWidth*(-currentPosition)
      });
    });
  
    // manageControls: Hides and Shows controls depending on currentPosition
    function manageControls(position){
      // Hide left arrow if position is first slide
      if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
      // Hide right arrow if position is last slide
      if(position==numberOfSlides-1){ $('#rightControl').hide() } else{ $('#rightControl').show() }
    } 
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>and this is the html that I use:</p>
  
  <pre><code> &lt;!-- Slideshow HTML --&gt;
    &lt;div id="slideshow"&gt;
      &lt;div id="slidesContainer"&gt;
        &lt;div class="slide"&gt;
          &lt;img src="Images/banner/z1.png" alt="Добредојдовте во светот на децата!" /&gt;
        &lt;/div&gt;
        &lt;div class="slide"&gt;
          &lt;img src="Images/banner/z2.png" /&gt;
        &lt;/div&gt;
        &lt;div class="slide"&gt;
          &lt;img src="Images/banner/z3.png"/&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;!-- Slideshow HTML --&gt;
  </code></pre>