html聊天框样式插件,轻量级Material Design风格jquery对话框插件
jquery.msgBox.js是一款轻量级的Material Design风格jquery对话框插件。它压缩后的版本仅1kb，并且允许自定义对话框的图标，以及设置回调函数。
使用方法
在页面引入jquery.msgBox.min.css，jquery，jquery.msgBox.min.js文件。
调用对话框
可以使用下面的方法来调用对话框。
$('.msgBox-testArea').msgBox({
title: '对话框的标题',
message: '对话框中的内容。。。'
});
你也可以为对话框添加自定义的按钮。
$('.msgBox-testArea').msgBox({
title: '对话框的标题',
message: '对话框中的内容。。。',
buttons: [{
text: 'Show',
callback: function() {
// 这里是回调函数
}
},
{
text: 'Hide',
callback: function() {
// 这里是回调函数
}
}],
});
还可以为对话框设置淡入淡出效果。
$('.msgBox-testArea').msgBox({
title: '对话框的标题',
message: '对话框中的内容。。。',
buttons: [{
text: 'Show',
callback: function() {
// 这里是回调函数
}
},
{
text: 'Hide',
callback: function() {
// 这里是回调函数
}
}],
blend: true,
blendDuration: 400
});
设置对话框的图标
你可以为对话框设置一些内置的图标，可用的图标有：
check
download
exclamation
info
lock
unlock
play
plus
question
remove
stop
例如：
$('.msgBox-testArea').msgBox({
type: 'question'
});