CODEWITHSUNDEEP
javascriptjqueryhtmlcss
JohnnyQ
JohnnyQ

Reputation: 543

Making a div not display until after a time

I have a div on the top of the browser and I only want it to appear after a certain amount of time. I have tried hiding it and putting a delay on it showing but because I have a hover request it shows straight away once someone hovers over it.

Here is the Jsfiddle http://jsfiddle.net/Johnnyfanta/8xLSa/

I have tried 

$(document).ready(function() {
    /* hide then delay 5 seconds to appear */
    $('#leave').hide().delay(5000).show(); 
    $('#exit_popup').hide();

    $('#leave').hover(function() {
        $('#exit_popup').show();
        $('#lightbox').show();
    });
});

When the page loads the id tag is there, but the display is set to none, how can I hide the tag.

Thanks

Upvotes: 1

Views: 91

Answers (2)

defau1t
defau1t

Reputation: 10619

A Simple setTimeout is enough, I guess

$(function() {
    setTimeout(function() {
        $("body").append("<div class='test'></div>")
    }, 3000);
})

http://jsfiddle.net/X8CgL/

Upvotes: 1

Alvaro
Alvaro

Reputation: 41605

I would make use of the setTimeout function.

$('#leave').hide();  //or better with CSS...

setTimeout(function(){
    $('#leave').show();
}, 5000);

Live example

Upvotes: 4

Related Questions