Show div after 2 seconds of page load

javascript, jquery

Solution

$(document).ready(function() {
    $(".contentPost").delay(2000).fadeIn(500);
});

Will work perfectly.

Problem

I am currently trying to show a div 2 seconds after the page is loaded. I can successfully do the reverse by hiding the div two seconds after the page loads. The issue is that nothing occurs and the div stays hidden. How can I properly show a div after two seconds of page load? Extra: mean while the two seconds are running show an ajax loading gif and then fade in the div ``` <script type = "text/javascript"> $(window).load(function() { setTimeout(function() { $("#contentPost").show('fadeIn', {}, 500) }, 2000); }); </script> ``` html/css ``` <style> .contentPost { display:none;} </style> <div class="contentPost"> <h2>Hi there</h2> </div> ```

Original source