Tutorial Append Site Overlay DIV

by in , 0 

$(function() {

   var docHeight = $(document).height();

   $("body").append("<div id='overlay'></div>");

   $("#overlay")
      .height(docHeight)
      .css({
         'opacity' : 0.4,
         'position': 'absolute',
         'top': 0,
         'left': 0,
         'background-color': 'black',
         'width': '100%',
         'z-index': 5000
      });

});

Overlays entire site with a black tint, disabling all links and bringing into focus anything above it.

Leave a Reply