大家好，本此介绍的jquery插件是使用div层模拟模态对话框，使用css样式的opacity和z-index可以很好的控制模拟对话框的UI以及提高用户体验。
此插件的运行效果如下：
可以看到其显示效果为时下最流行的sns社区弹出框样式，当然开发人员也可以根据需要修改相应的样式。
API：
data(Object): 传递到对话框的数据。
buttonText(String): 按钮显示的文本（如上图中的“删除”）。
okEvent(Function): 点击按钮时处理的事件。
initWidth(Interger): 对话框的初始宽度，默认为400。
title(String): 对话框显示的标题。
content(String): 对话框显示的内容（可包含html标签）。
overlayCss(Object): 背景层样式（主要用于遮挡其他页面内容）。
jmodalbgCss(Object): 对话框背景样式（如上图中的边框）。
jmodalCss(Object): 对话框样式。
closeCss(Object): 关闭按钮的样式。
titleCss(Object): 对话框标题样式。
contentCss(Object): 对话框内容样式。
bottomCss(Object): 对话框底部样式。
buttonCss(Object):按钮样式。
使用方法：
JavaScript Code
- $.fn.jmodal({
- title: 'Information',
- content: 'Hi,you displayed me?',
- buttonText: 'Yes,It\'s me',
- okEvent: function(e) {
- alert('jmodal\'ll be closed after u click me:-)');
- }
- });
效果如下：
ps:为了使此插件使用时效率更高，可将API中的样式单独存放于.css文件中加以引用。
下载此插件[JMODAL]