jquery对话框插件——MintDialog

为什么80%的码农都做不了架构师？>>>   

简介

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

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

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

用法

引入相关的文件

<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			关闭对话框

转载于:https://my.oschina.net/cnlw/blog/390202