jQuery实现简单的模态对话框 dialog-model-mask#遮罩层 dialog-model-show#弹出层边缘 dialog-model-text#弹出层text jQuery var Dialog = Dialog || {};Dialog.showModel = function (width, height, text){var wdw = $(window).width();var wdh = $(window)
jQuery实现简单的模态对话框
var Dialog = Dialog || {}; Dialog.showModel = function (width, height, text){ var wdw = $(window).width(); var wdh = $(window).height(); var left = Math.ceil((wdw - width)/2); var top = Math.ceil((wdh-height)/2)-Math.floor(height/3); var html = '<div id="dialog-model-mask" style="width:'+ wdw +'px;height:'+ wdh +'px;background:#000000;position:fixed;z-index:999;left:0px;top:0px;opacity:0.3;filter:alpha(opacity=30);"></div>'; html += '<div id="dialog-model-show" style="width:'+ width +'px;height:'+ height +'px;margin:0px;padding:0px;border:8px solid #555555;border-radius:5px;position:fixed;z-index:998;left:'+ left +'px;top:'+ top +'px;opacity:0.6;filter:alpha(opacity=60);"></div>'; html += '<div id="dialog-model-text" style="width:'+ width +'px;height:'+ height +'px;margin:0px;padding:0px;background:#ffffff;position:fixed;z-index:1000;left:'+ (left + 8) +'px;top:'+ (top + 8) +'px;">'+ text +'</div>'; $(document.body).append(html); } Dialog.hideModel = function (){ $("div#dialog-model-mask").hide(); $("div#dialog-model-show").hide(); $("div#dialog-model-text").hide(); }