How to set a gray-ish background with modal dialog?

I see on some of the Infragistics examples that you are setting the background to a gray-ed out look while making a modal window pop-up. How is that done?

Thanks.

Not sure how it is done with the webdialog but to achive the same thing It is a div set to absolute position, 100%width 100%height z-index:100000 (you get the idea) using a semi-transparent png (plus for IE->dx transforms) it is pretty simple, just a css show hide deal.

Thanks. I tried using the ModalBackgroundCSSClass property to no avail but then used your idea instead. Here is my code to make it work along with the little Png I made for it.:

 

    <style type="text/css">

                   .ModalBackdrop {

                             width: 100%;

                             height: 100%;

                             z-index: 100000;

                             position: absolute;

                             background-image: url(ModalBG.png);

                             background-repeat: repeat;

                             margin-top: 0px;

                             margin-left: 0px;

                   }

 

        body

        {

                  margin: 0 0 0 0;

        }

       

    </style> 

   

    <script type="text/javascript">

        function SetModal() {

           document.getElementById("ModalBackdrop").className = "ModalBackdrop";

 

        }

       

        function RestoreNonModal() {

        var dialog=$find('WebDialogWindow1');

       

          if(dialog.get_WindowState == "undefined"); {

            //it's hidden

            document.getElementById("ModalBackdrop").className = "";

          }

           

        }

   

    </script> 

 

And this div in my form area.

<div id="ModalBackdrop" class=""></div>

Here is the 16×16 png –> 

Hi

I have a question did you do this by setting the modal property to 'true' because i am trying to achieve something similar to this but with modla property being 'false'   can you help me on this