How can i add mask filter to a jquery sliding drop down panel

How can i add mask filter to a jquery sliding drop down panel

I made a sliding panel with jQuery to add login form in it.
I wanted to make something like xenforo login system Link : http://xenforo.com/community/ 

After you toggle the slideing panel in the link above the whole page background dims out and this is effect of masking seen in modal boxes and i need this to be done to the sliding panel i have made.

Here is the example fiddle i made : http://jsfiddle.net/envira/yEzke/ 





Here is the code i am using :

<div class="panel"> <div class="panell"></div> <a href="#" class="panelbutton">Open <span></span></a> $('.panelbutton').on('click', function(event){ event.preventDefault(); $('.panell').slideToggle('fast', function(event){ if($(this).is(':visible')){ $('.panelbutton').html('Close ▲'); } else { $('.panelbutton').html('Open ▼'); } }); });

I wanted to add the mask functionality like xenforo drop down !! I need help to fix it , Help is appreciated, 
regards