title: Very simple image slider to auto slide
body: <p>Hey guys I have an image slider that has controls but I also want to intergrate an auto scroll into the JS too. I have looked around but cannot seem to understand where to insert the code I need and exact what code it is..</p>
  
  <pre><code>$(document).ready(function() {
      $('.sp').first().addClass('active');
      $('.sp').hide();    
      $('.active').show();
  
      $('#button-next').click(function() {
          $('.active').removeClass('active').addClass('oldActive');
  
          if ( $('.oldActive').is(':last-child')) {
              $('.sp').first().addClass('active');
          }
          else {
              $('.oldActive').next().addClass('active');
          }
  
          $('.oldActive').removeClass('oldActive');
          $('.sp').fadeOut();
          $('.active').fadeIn();
      });
  
      $('#button-previous').click(function() {
          $('.active').removeClass('active').addClass('oldActive');    
          if ( $('.oldActive').is(':first-child')) {
              $('.sp').last().addClass('active');
          }
          else {
              $('.oldActive').prev().addClass('active');
          }
          $('.oldActive').removeClass('oldActive');
          $('.sp').fadeOut();
          $('.active').fadeIn();
      });
  });
  </code></pre>
  
  <p>So it has literally a next and previous nav which works fine I would like it to just auto scroll through the images.</p>