Autostart a slideshow with javascript

tbowden Source

I am new to JS Coding!

I am trying to setup an automated slideshow with next and previous buttons, and thumbnails with it automatically flowing through the slides (when I press the next it will override the time interval, and go next etc.).

I have successfully set up the next and previous buttons along with the thumbnails. However I can't seam to get the slideshow to autoplay!

Here is the JS code I am woking with:

$(document).ready(function () { // this function loads all code before it runs

var timer = ''
var currentImage = $('#slideShow > div:first') // set first Image for slideshow
var currentThumb = $('#thumbs > img:first') // Set first Image for Thumbnails
$('#arrowRight, #arrowLeft').click(function(e) {
    if ( == 'arrowRight') {
        $('#slideShow > div:first')
    else {
        $('#slideShow > div:last')

I believe adding }, 3000);to under the .fadeOut(1000);should work, however I am not getting any luck!

I am basing the JS on:


I would like to know how to make the slideshow autoplay when the webpage is open?



comments powered by Disqus