. Default dialog box, no custom settings. Click here to open.
$.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery'); . The five dialog box types, with titles: error, warning, question, information and confirmation.
// this example is for the "error" box only
// for the other types the "type" property changes to "warning", "question", "information" and "confirmation"
// and the text for the "title" property also changes
$.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery', {
'type': 'error',
'title': 'Error'
}); . Custom buttons and the callback function. Click here to open.
Note that the onClose event is executed *after* the dialog box is closed! see the next example for executing functions *before* the closing of the dialog box
$.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery', {
'type': 'question',
'title': 'Custom buttons',
'buttons': ['Yes', 'No', 'Help'],
'onClose': function(caption) {
alert((caption != '' ? '"' + caption + '"' : 'nothing') + ' was clicked');
}
}); 3.1 Custom buttons with attached callback functions. Click here to open.
Note that the callback functions attached to custom buttons are executed *before* the dialog box is closed and as soon as a button is clicked! see the previous example for executing functions *after* the closing of the dialog box
$.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery', {
'type': 'question',
'title': 'Custom buttons',
'buttons': [
{caption: 'Yes', callback: function() { alert('"Yes" was clicked')}},
{caption: 'No', callback: function() { alert('"No" was clicked')}},
{caption: 'Cancel', callback: function() { alert('"Cancel" was clicked')}}
]
}); . Position the dialog box in the top-right corner. Click here to open.
$.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery', {
'title': 'Custom positioning',
'position': ['right - 20', 'top + 20']
}); . Use as a notification widget - no buttons and close automatically after seconds.
Note how the plugin needs to be instantiated with the "new" keyword or only the last opened box will close!
Click here to open.
new $.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery', {
'buttons': false,
'modal': false,
'position': ['right - 20', 'top + 20'],
'auto_close':
}); . External content loaded via AJAX. Click here to open.
new $.Zebra_Dialog('<strong>Some dummy content:</strong><br><br>', {
'source': {'ajax': 'ajax.html'},
width: ,
'title': 'External content loaded via AJAX'
}); 6.1 External content loaded in an iFrame. Click here to open.
new $.Zebra_Dialog('<strong>Content loaded via AJAX:</strong>', {
source: {'iframe': {
'src': 'http://en.m.wikipedia.org/wiki/Dialog_box',
'height':
}},
width: ,
title: 'External content loaded in an iFrame'
}); . Customizing the appearance - make the title bar have a dark-blue background and show a custom icon! The CSS is
/* Notice how we're targting the dialog box's title bar through the custom class */
.myclass .ZebraDialog_Title { background: #DEDEDE; border-bottom: 1px solid # }
.myclass .ZebraDialog_Body { background-image: url('coffee_48.png') }
Click here to open.
new $.Zebra_Dialog('Buy me a coffee if you like this plugin!', {
'custom_class': 'myclass',
'title': 'Customizing the appearance'
});
(function ($) {
$.psAlert = function (info, type,setting,title) {
var alerttype = '';
var alerttitle = '';
switch (type) {
case :
alerttype = 'error';
alerttitle = '错误提示';
break;
case :
alerttype = 'warning';
alerttitle = '警告提示';
break;
case :
alerttype = 'information';
alerttitle = '消息提示';
break;
case :
alerttype = 'confirmation';
alerttitle = '正确提示';
break;
default:
alerttitle = title;
break;
}
var defaults = {
'type': alerttype,
'title': alerttitle
};
var opts = $.extend(defaults, setting);
new $.Zebra_Dialog(info, opts);
};
})(jQuery);
//$.psAlert('请输入回复内容!', 2);

//if (result.DoFlag) {
// $.psAlert(result.DoResult, 4, {
// 'buttons': [
// {
// caption: '确定', callback: function () {
// location.reload();
// }
// }
// ]
// });
//} //$.psAlert(rejectcontentbox, 0, {
// 'modal': true,
// 'overlay_close': false,
// 'custom_class': 'dialog',
// 'overlay_opacity': 0.5,
// 'width': 300,
// 'height': 200,
// 'buttons': [
// {
// caption: '确认',
// callback: function () {
// refusedReason = $.trim(($("#refusedre").val()));
// if ($.trim(refusedReason).length == 0) {
// $.psAlert('请注明拒绝理由!', 2);
// } else {
// auditComment();
// }
// }
// }
// ]
//}, "拒绝理由");

Zebra_Dialog 弹出层插件的更多相关文章

  1. jQuery弹出层插件popbox

    都什么年代了,还自己写弹出层插件!是的,①自己写的自己好控制②可定制性高③兼容低版本IE 本插件有以下特性: 样式分离,可定制,纯净无图片 可自定义按钮及按钮的样式.点击事件 可指定选择器选择页面元素 ...

  2. 写了一个jquery的 弹出层插件。

    下载地址:http://pan.baidu.com/s/1eQ26CMm ps:ajax加载做的,要有环境才能正常运行哦! //这是一个以ajax加载显示弹出层插件  参数(option): widt ...

  3. 效果非常好的 Jquery弹出层插件 jQuery Sweet alert

    介绍款交互性非常不错的jquery弹出层插件,支持消息提示.错误提示.确认框提示等. 交互式体验感非常不错,比如咱们现在体验非常不错的微信支付.支付宝等完成后的效果. 不过本插件至少支持IE9+ Jq ...

  4. Jquery学习之路(三) 实现弹出层插件

    弹出层的应用还是比较多的,登陆,一些同页面的操作,别人的总归是别人的,自己的才是自己的,所以一直以来想写个弹出层插件.不多废话,直接开始吧! 不想看可以在这里直接下载源码xsPop.zip 1:遮罩层 ...

  5. 在Vue中使用layer.js弹出层插件

    layer.js(mobile)是一个小巧方便的弹出层插件,在之前的apicloud项目中被大量使用,但最近对apicloud的IDE.非常不友好的文档和极低的开发效率深感厌烦,决定弃用然后转向Vue ...

  6. layer/layui弹出层插件bug

    <button class="layui-btn" lay-submit lay-filter="formDemo" id="layui-btn ...

  7. 网站开发常用jQuery插件总结(二)弹出层插件Lightbox_me

    网站开发过程中,为了增加网站交互效果,我们有时需要在当前页面弹出诸如登陆.注册.设置等窗口.而这些窗口就是层,弹出的窗口就是弹出层.jQuery中弹出层插件很多,但有些在html5+css3浏览器下, ...

  8. 网站开发常用jQuery插件总结(二)弹出层插件Lightbox

    网站开发过程中,为了增加网站交互效果,我们有时需要在当前页面弹出诸如登陆.注册.设置等窗口.而这些窗口就是层,弹出的窗口就是弹出层.jQuery中弹出层插件很多,但有些在html5+css3浏览器下, ...

  9. webui-popover 一个轻量级的jquery弹出层插件

    该提示框插件可以和Bootstrap完美结合,但是并不一定需要和Bootstrap一起使用.它支持IE7以上的浏览器. 首先要引入需要的css  js  文件 <link rel="s ...

随机推荐

  1. python split()函数使用拆分字符串 将字符串转化为列表

    函数:split()Python中有split()和os.path.split()两个函数,具体作用如下:split():拆分字符串.通过指定分隔符对字符串进行切片,并返回分割后的字符串列表(list ...

  2. c++ Windows Socket实现最简单的C/S网络通信(TCP)

    1.服务器端代码: #include<iostream> #include<WinSock2.h> #pragma comment(lib, "ws2_32.lib& ...

  3. Design Pattern :Factory and Reflect in java

    interface page {     void Render(); } class pageA implements page {     @Override     public void Re ...

  4. MySql 定时备份数据库

    每天零点备份一次数据库,备份文件放在指定目录(如果目录不存在则新建),按月存储: 将下面这段命令存储为一个 *.bat 文件,添加一个Windows任务计划程序(Task scheduler)指向这个 ...

  5. Hibernate之Query接口的uniqueResult()方法

    如果查询返回多个值用list()方法 public void testQuery(){ Configuration config = new Configuration().configure(); ...

  6. Android组件系列----ContentProvider内容提供者

    [声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/4 ...

  7. 第12章 纤程(Fiber)

    12.1 纤程对象的介绍 (1)纤程与线程的比较 比较 线程(Thread) 纤程(Fiber) 实现方式 是个内核对象 在用户模式中实现的一种轻量级的线程,是比线程更小的调度单位. 调度方式 由Mi ...

  8. java 20 - 6 加入了异常处理的字节输出流的操作

    昨天坐了十几个钟的车回家,累弊了.... ————————————割掉疲劳————————————— 前面的字节输出流都是抛出了异常不管,这次的加入了异常处理: 首先还是创建一个字节输出流对象,先给它 ...

  9. 关于codereview工具与建议

    http://www.ibm.com/developerworks/rational/library/11-proven-practices-for-peer-review/

  10. Lua笔记(1)

    今天开始学习Lua,下面把一些重点记下来: 单行注释-- ,多行注释 --[[  .......  --]] Lua中false和nil表示条件判断的假,其余的,包括空字符串,0,都表示真. Lua没 ...