Code to make div appear after a certain amount of time.

Question

Hi,

I'm looking for code that makes a div appear after a certain amount of time on a site. Here's the sort of thing I'm talking about:

<div class="container">
<div class="secretpopout">
This is the div I want to pop out after a couple of minutes.
</div>
</div>

I'm relatively new to javascript and jQuery, but I'm assuming I will need to use the setTimeout or something similar. I've tried finding the answer online, but if someone could explain it in a way a designer (as opposed to a programmer) would get it, that would be great - ANY LIGHT shed on this would be greatly appreciated.

Thank you.

Answer 1

You can do this with very little code in jQuery 1.4+ using .delay(), like this:

$(function() {
  $(".secretpopout").delay(120000).fadeIn();
});

This would show it after 2 minutes, just give it some CSS so it's hidden initially:

.secretpopout { display: none; }