配置参数演示
内容 [content]
art.dialog({
content: '我支持HTML'
});
按钮 [yesFn & noFn]
锁屏 [lock & lockClick]
art.dialog({
lock: true,
content: '中断用户在对话框以外的交互,展示重要操作与消息',
yesFn: function(){
art.dialog({content: '再来一个锁屏', lock: true});
return false;
},
noFn: true
});
跟随元素 [follw]
art.dialog({
follow: document.getElementById('followTestBtn'),
content: '让对话框跟着某个元素,这里的follw可以是ID字符串'
});
自定义坐标 [left & top]
art.dialog({
left: 100,
top: 'center',
content: '我改变坐标了'
});
设置大小 [width & height]
art.dialog({
width: '20em',
height: 55,
content: '尺寸可以带单位'
});
静止定位 [fixed]
art.dialog({
fixed: true,
content: '请拖动滚动条查看'
});
不许拖拽 [drag]
art.dialog({
drag: false,
content: '禁止拖拽'
});
不限制挪动范围 [limit]
art.dialog({
limit: false,
content: '我可以不受限制的拖动了'
});
定时关闭的消息 [time]
art.dialog({
time: 2,
content: '两秒后关闭'
});
防止重复弹出 [id]
art.dialog({
id: 'testID',
content: '再次点击运行看看'
});
改变标题 [title]
art.dialog({
title: '我是标题',// 如果为false将不显示标题栏
content: 'hello world!'
});
改变皮肤 [skin]
art.dialog({
skin: 'aero',
content: '我是一个漂亮的半透明皮肤,支持IE6哦'
});
定义消息图标 [icon]
art.dialog({
icon: 'succeed',
skin: 'aero',
content: '我可以定义消息图标哦'
});
没有外边框 [border]
art.dialog({
border: false,
content: '并不是所有的皮肤都支持这个选项'
});
模板解析 [tmpl & content]
var JSON = {
code: 0,
users: ['糖饼', '月月鸟', '水水', '丽丽', '花花', '大叔'],
me: '糖饼',
web: 'http://www.planeart.cn'
};
var html = '\
<% if (code === 0) { %>\
<p>当前用户:<a href="<%=web%>" title="<%=web%>"><%=me%></a></p>\
<p>\
所有用户:\
<% for (i = 0; i < users.length; i++) { %>\
<%=i + 1%>.<%=users[i]%> \
<% } %>\
</p>\
<% } else { %>\
<p>哦,服务器出错了,错误代码:<%=code%><p>\
<% } %>\
';
art.dialog({
content: JSON,
tmpl: html
});
定位焦点 [focus]
art.dialog({
focus: false,// false是取消对话框按钮自动拥有焦点.这里也可以传入元素
content: '默认焦点是附加到对话框按钮上的<br />' +
'你可以给focus参数传入元素对象'
});
取消ESC [esc]
art.dialog({
esc: false,
content: '按esc无法关闭我'
});
弹出不显示 [show]
art.dialog({
show: false,// 后续可以用内部接口show()恢复显示
content: 'hello world'
});