jquery对话框插件——MintDialog

简介

弹窗插件。以面向对象方式使用。通过接口,可以随时改变标题和窗体,支持拖动,灵活方便

网站:http://mint-ui.wemakers.net/

下载:http://git.oschina.net/895925636/mint-ui

jquery对话框插件——MintDialog

用法

引入相关的文件

<script src="../lib/jquery-1.8.3.min.js"></script>
<script src="MintDialog.js"></script>

编写html

<button onclick="dia1.show();">模态弹窗</button>
<button onclick="dia2.show();">非模态弹窗</button>

编写js

var dia1 = new MintDialog({
    title : "模态弹窗",
    body : "hello friends"
});

var dia2 = new MintDialog({
    title : "非模态弹窗",
    body : "hello friends",
    modal:false,
    moveable:true
});

效果

点击页面的两个按钮,就会弹出相应对话框

初始化参数(setting)

参数名 类型 语义
setting.title 字符串 或者 dom对象 对话框的标题
setting.body 字符串 或者 dom对象 对话框的窗体内容
setting.modal boolean 是否模态。模态窗口有背景遮罩
setting.moveable boolean 是否可拖动。当setting.modal==true时,该参数无效
setting.closeOnMaskClick boolean 当遮罩背景被点击时,是否关闭对话框。只有在setting.modal==true时有效
setting.beforeClose() function 这是一个回调函数,在对话框被关闭时执行。如果beforeClose返回true,对话框关闭,否则不会关闭
setting.onShow() function 对话框打开完毕的回调函数

api

mintdialog是面向对象的,可以通过api对dialog对象进行操作。

api名 参数 返回值 描述
setTitle 字符串 或者 dom 给dialog设置新的标题
setBody 字符串 或者 dom 给dialog设置新的窗体
getTitle 字符串 或者 dom 获取dialog的标题
getBody 字符串 或者 dom 获取dialog的窗体
show 打开dialog
close 关闭对话框

你可能感兴趣的:(jquery对话框插件——MintDialog)