За последние 24 часа нас посетили 17112 программистов и 1299 роботов. Сейчас ищут 1452 программиста ...

кнопка закрытия модального окна

Тема в разделе "JavaScript и AJAX", создана пользователем artemkhv, 30 окт 2012.

  1. artemkhv

    artemkhv Активный пользователь

    С нами с:
    25 сен 2012
    Сообщения:
    10
    Симпатии:
    0
    Помогите сделать кнопку или ссылку закрытия модального окна...

    ВОТ СКРИПТ
    Код (Text):
    1.  
    2.     (function($){
    3.         $.fn.extend({
    4.             leanModal:function(_1){
    5.                 var _2={
    6.                     top:150,
    7.                     overlay:0.8
    8.                 };
    9.                
    10.                 _1=$.extend(_2,_1);
    11.                 return this.each(function(){
    12.                     var o=_1;
    13.                     $(this).click(function(e){
    14.                         var _3=$("<div id='lean_overlay'></div>");
    15.                         var _4=$(this).attr("href");
    16.                         $("body").append(_3);
    17.                         $("#lean_overlay").click(function(){
    18.                             _5(_4);
    19.                         });
    20.                         var _6=$(_4).outerHeight();
    21.                         var _7=$(_4).outerWidth();
    22.                         $("#lean_overlay").css({
    23.                             "display":"block",
    24.                             opacity:0
    25.                         });
    26.                         $("#lean_overlay").fadeTo(200,o.overlay);
    27.                         $(_4).css({
    28.                             "display":"block",
    29.                             "position":"fixed",
    30.                             opacity:0,
    31.                             "z-index":11000,
    32.                             "left":50+"%",
    33.                             "margin-left":-(_7/2)+"px",
    34.                             "top":o.top+"px"
    35.                             });
    36.                         $(_4).fadeTo(200,1);
    37.                         e.preventDefault();
    38.                     });
    39.                 });
    40.                 function _5(_8){
    41.                     $("#lean_overlay").fadeOut(200);
    42.                     $(_8).css({
    43.                         "display":"none"
    44.                     });
    45.                 };
    46.         }
    47.         });
    48.     })(jQuery);

    ФУНКЦИЯ ЗАПУСКА
    $(function() {
    $('a[rel*=leanModal]').leanModal({ top : 150 });
    });


    CSS

    #lean_overlay {
    position: fixed;
    z-index: 10000;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%;
    background: #000;
    display: none;
    }

    #test {
    background: url(../assets/img/lay/bg.jpg);
    padding: 23px 25px 23px 15px;
    display:none;
    border-radius: 5px 5px 5px 5px;
    }


    HTML

    <a rel="leanModal" name="test" href="#test">ссылка</a>
    <div id="test">
    <p>контент</p>
    </div>