CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Jacob
Jacob

Reputation: 2071

Larger delay on first run

Im having problems delaying the first run of a function. I've created a very simple slideshow but because of that I'm having problems delaying the first run.

I want the first run to wait 10 seconds and then keep the 4 second delay between the rest of the images.

This is my code:

function slideshow() {

    $("#slideshow .slide:hidden:first").fadeIn(1000).delay(4000).fadeOut(1000, function() {
        $(this).appendTo($(this).parent());
        slideshow();
    });

}

$(document).ready( function () {

    $("#slideshow .slide").hide();
    slideshow();

});

I've tried a few different things but none successful.

I don't think jsfiddle is needed on this issue but if you want it just comment and i'll set it up!

Thanks in advance!

Upvotes: 0

Views: 54

Answers (2)

Travis J
Travis J

Reputation: 82267

Use a timeout on the first call to your slideshow function. setTimeout accepts the second parameter as the amount of milliseconds to wait before executing the code in the argument. 10,000 milliseconds is 10 seconds.

$(document).ready( function () {
    $("#slideshow .slide").hide();
    setTimeout(function(){slideshow();},10000);
});

Upvotes: 0

binaryatrocity
binaryatrocity

Reputation: 976

You're looking for Javascript's built-in setTimeout function, it creates a timer and executes the passed code after the timer finishes. In your $(document).ready() you can try this:

 setTimeout( slideshow, 10000);

This will delay the execution of your slideshow function for 10 seconds. Documentation here

Upvotes: 2

Related Questions