jQuery диалог с затемнением фона (Рейтинг: -3)

Свежие Креативы и море позитива !!!
Печать RSS
Недавно задался вопросом с выводом диалога с затухающим и не активным фоном, вышло в две функции. В body создается div #op c длинной и шириной равной текущему документу, с черным фоном и прозрачностью 0.7, поверх него накладывается наш див с диалогом. При клике вне диалога, срабатывает обратный эффект исчезновение диалога и возврат нормального фона.
Пример
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru"> 
    <head> 
        <script type="text/javascript" src="/public/js/jquery.min.js"></script> 
        <script type="text/javascript"> 
            function mydialog(id) 
            { 
                $(id).show('slow'); 
                $('<div id="op" style="position: absolute;z-index:100;" onclick="op_close()"></div>').insertBefore('body'); 
                $('#op').css({ 
                    height: $(document).height(), 
                    width:  $(document).width(), 
                    background: 'black' 
                }).fadeTo('slow', '0.7'); 
           } 

           function op_close() 
           { 
               $('#op').fadeOut('slow'); 
               $('#dialog').fadeOut('slow'); 
           } 
        </script> 
    </head> 
        <body> 
           <div id="dialog" style="width: 700px;left: 30%;position: absolute;z-index: 101;display:no ne;" onclick="mydialog(this)"> 
              Содержимое диалога 
           </div> 

        </body> 
</html>
Добавил: orel 04.06.2013 / 22:32
jquery, dialog
Рейтинг: -3
Просмотры: 2332
Комментарии (0) »