user765081
user765081

Reputation: 261

Postpone execution of code inside document.ready()

I have a document.ready function that I am using to slide toggle and it looks like this:

$(document).ready(function() {


    if ($("div[id='feature-content']").is(":visible")) {
    $("div[id='feature-content']").hide();
    $("div[id='feature-content']").slideToggle(9000).delay(4000);
    }

    $("div[id='feature-content']").slideToggle(9000).delay(4000);


    });

});

I want the slide toggle to occur only after say, 5 secs, after rendering the page. So I modified the above code by including a setTimeOut() like below:

$(document).ready(function() {

    window.setTimeout(function() {

        if ($("div[id='feature-content']").is(":visible")) {
        $("div[id='feature-content']").hide();
        $("div[id='feature-content']").slideToggle(9000).delay(4000);
        }

        $("div[id='feature-content']").slideToggle(9000).delay(4000);


        });
    }
    ,
    15000
    );
}); 

But I am not able to get it to work. Can someone help me to accomplish my objective?

Thank you.

Upvotes: 1

Views: 140

Answers (1)

Jared Farrish
Jared Farrish

Reputation: 49238

You have an extra }); in your code:

$(document).ready(function() {
    window.setTimeout(function() {
        if ($("div[id='feature-content']").is(":visible")) {
            $("div[id='feature-content']").hide();
            $("div[id='feature-content']").slideToggle(9000).delay(4000);
        }

        // }); <<< This should not be here

        $("div[id='feature-content']").slideToggle(9000).delay(4000);
    }
    ,
    5000
    );
}); 

http://jsfiddle.net/CnQ38/

If you're not already, please consider Firebug or Chrome Console. Both would have told you about the extra code/syntax error.

Upvotes: 2

Related Questions