Wesley Weaver
Wesley Weaver

Reputation: 29

Set visibility of css div after predetirmned time after document loads

Simply, I want my page to wait for 3-4 seconds then make everything in my main div visible.

I know I can set the visibility of the div ahead of time (to hidden), and then add a script that changes the visibility to visible after the page loads.

I'm pretty new to jquery/javascript so I'm not certain how to toggle that switch nor how to make it wait for a specific time after the document loads.

I have:

$(document).ready(function(){

some sort of sleep or delay
$("#dropshadow").notsurewhattodofromhere

});

So I have the very basic completely unfunctional flow of what I want, but all the java i keep trying to plug in there from what i'm seeing about delays doesn't seem to do anything at all, and i'm not sure how to target the visibility of the div with the function

Upvotes: 0

Views: 5622

Answers (4)

Wesley Weaver
Wesley Weaver

Reputation: 29

This is what finally ended up working for what I wanted to do.

Thanks for all the help!

<script type="text/javascript">

$(document).ready(function(){
    $("#dropshadow").hide();

    setTimeout(function(){
        $("#dropshadow").fadeIn(1000)
    }, 1500 );

});

</script>

Upvotes: 0

Hemant_Negi
Hemant_Negi

Reputation: 2078

Try setTimeout() method

$(document).ready(function(){

 setTimeout(function(){

//do what ever you want here
 }, 3000 );

});

Upvotes: 1

Adil Shaikh
Adil Shaikh

Reputation: 44740

You can use setTimeout(),

setTimeout(function(){
   $("#dropshadow").show();
},3000); // 3 second delay

Upvotes: 2

Edorka
Edorka

Reputation: 1811

setTimeout( function(){}, timeInMilliseconds);

Upvotes: 0

Related Questions