html - CSS overlay on scrollable DIV -

I have a class overlay whose purpose is to create an overlay while loading data I can add it to any div. It works entirely except for divs , where content can overflow.

HMTL

  
 MyDiv "& gt; Div class =" overlay "> 
  & Lt; div id = "innerDiv" & gt; & lt; / div & gt; & lt; / div & gt;  

CSS

  .overle {status: absolute; background color: # 888888; top: 0 pixel; ambiguity: 0.5; bottom: 0 pixel; right: 0 pixel; left: 0 pixel; z-index : 50px;}  

Here is the example at . Scroll down in the box and you will see the problem.

Any JavaScript Without the height of internal code to .oplao css, you must pass.

  Overlay {display: block; position: full; background color: # 888888; top: 0 pixel; ambiguity: 0.5; height: 600px; hidden flux; bottom: 0 pixel; right: 0 pixel; left: 0 pixels; Z-index: 50;}  

You can do it dynamically:

$ ('. Overlay '). CSS ('height', $ ('# internal div'). Height ());

Cheers!