Hide DIV/SPAN Element Automatically After a Few Seconds Using jQuery

One of the many ways to get 100% attention from your website visitors is to interact with them using popups. Nope, not the 90s, ugly, annoying popup but the neat jQuery modal one. And sometimes you wanna automatically fade out that DIV / SPAN popup element in effort to improve user experience, so here’s something you might find useful.

Of course the most popular JavaScript library, jQuery, is used in this method of automatically fading out and hiding a popup box after a few seconds. I’ve used this code once, when my client requested a popup containing promotions on the home page to automatically fadeout after 5 seconds.

jQuery Auto Fade Function

Here’s the code:

$(document).ready(function(){
   setTimeout(function(){
      $("#popupBox").fadeOut("slow") //#popupBox is the DIV to fade out
   }, 5000); //5000 equals 5 seconds
});

Have fun boys and girls. ;)