Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Code to make div appear after a certain amount of time

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.

like image 757
user307783 Avatar asked Apr 02 '10 16:04

user307783


People also ask

How do you show DIVs after 5 seconds?

Use noscript tag and put div in it to display when java script is disabled in browser. Show activity on this post. Show activity on this post. The below code worked for me, if you are intending to show the Div for a few seconds...

How do you show a div for 10 seconds and then hide it?

Your code show(). delay(10000). hide() will hide the element immediately and not after 10 seconds.


1 Answers

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; }
like image 78
Nick Craver Avatar answered Sep 29 '22 10:09

Nick Craver