alertify

.alert-overlay {     visibility:visible;      position: absolute;   /* 使用绝对定位或固定定位  */     left: 0px;        top: 0px;     width:100%;     height:100%;     text-align:center;     z-index: 1100; } .alert-data{     width:300px;     margin: 0 auto;     background-color: #fff;     text-align:center;     box-shadow: 0 0px 20px #666666;     border-radius: 4px; } .stop-scrolling{     height:100%;     overflow:hidden; } .alert-header{     padding:10px;     text-align:left;     background-color: #f5f5f5;     border-radius: 4px; } .alert-close{     float: right;     cursor: pointer;     width: 20px;     height: 20px;     line-height: 20px;     color:#adadad;     text-align:center; } .alert-close:hover{     color:#333; } .alert-body{     padding: 20px 30px;     text-align: left;     font-size: 14px; } .alert-footer{     padding:10px; } .alert-footer button{     float:right; } .alert-footer:after,.alert-header:after,.alert-body:after{     display: table;     content: "";     width: 0;     clear: both; } .alert-btn{     margin-right: 5px;     padding: 5px 15px;     font-size: 14px;     line-height: 1.42857143;     text-align: center;     cursor: pointer;     border: 1px solid transparent;     border-radius: 4px;     background-color: #fff;     border-color: #ccc; } .alert-btn:hover{     background-color: #e6e6e6;     border-color: #adadad; } .overflow-hidden{     overflow:hidden; }

 

 

 

;(function($,undefined){     $.extend({         alert:alert,         confirm:confirm     });     var $modal = {         overlay: 'div',         data: 'div',         header: 'div',         title: 'span',         close: 'div',         body: 'div',         footer: 'div',         ok: 'button',         cancel: 'button'     },     DefaultOptions = {         okText: '确定',         cancelText: '取消',         titleText: '提示',         cancelcb: undefined,         style: {},     },     Options,     Modal = {         create: function () {             if ($('.alert-overlay').length == 0) {                 for (var x in $modal) {                     $modal[x] = $('<' + $modal[x] + ' class="alert-' + x + '"></' + $modal[x] + '>');                 }                 $('body').append(                     $modal.overlay                     .append($modal.data                         .append($modal.header                             .append($modal.title)                             .append($modal.close))                         .append($modal.body)                         .append($modal.footer                             .append($modal.cancel)                             .append($modal.ok))));                 $modal.close.html('X').click(Modal.hide);                 $modal.ok.html(Options.okText).addClass('alert-btn');                 $modal.cancel.html(Options.cancelText).addClass('alert-btn');                 $modal.title.html(Options.titleText);             } else {                 for (var x in $modal) {                     $modal[x] = $('.alert-' + x);                 }             }             for (var x in $modal) {                 $modal[x].attr('style', '');             }             for (var x in Options.style) {                 $modal[x].attr('style', Options.style[x]);             }         },         show: function () {             $('body').addClass('overflow-hidden');             $modal.overlay.css('visibility', 'visible');             $modal.data.css('margin-top', $(document).scrollTop() + 150);         },         hide: function () {             $('body').removeClass('overflow-hidden');             $modal.overlay.css('visibility', 'hidden');         },     };

    function alertBase(msg, options) {         Options = {};         $.extend(Options, options,DefaultOptions);         Modal.create();         Modal.show();         $modal.ok.unbind('click').bind('click', Modal.hide);         $modal.body.html(msg);     }

    function alert(msg, options) {         alertBase(msg,options);         $modal.cancel.hide();     }     function confirm(msg,okcb,options) {         alertBase(msg, options);         $modal.cancel.unbind('click').bind('click', Modal.hide);         if (typeof (okcb) == "function") {             $modal.ok.bind('click', okcb);         }         if (typeof (Options.cancelcb) == "function") {             $modal.cancel.bind('click', Options.cancelcb);         }     } })(jQuery);