. 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. try catch finally 用法

    trycatchfinally 1.将预见可能引发异常的代码包含在try语句块中.2.如果发生了异常,则转入catch的执行.catch有几种写法:catch这将捕获任何发生的异常.catch(Exc ...

  2. android怎么连接sqlite数据库?

    SQLite数据库首先先建立SQLiteOpenHelper()的子类实现SQLiteOpenHelper中的OnCreate()方法和构造方法. this class takes care of o ...

  3. java String部分源码解析

    String类型的成员变量 /** String的属性值 */ private final char value[]; /** The offset is the first index of the ...

  4. Linux学习之三——操作档案与目录

    一. 目录文档操作指令 1. pwd 显示目前所在目录 如果加上-P 的选项,则取得正确的目录名称,而不是以链接文件的路径来显示. 例如CentOS下,刚刚好/var/mail是/var/spool/ ...

  5. EntityFramework6 快速入门教程

    EntityFramework6 快速入门教程 不得不说EF在国内实在是太小众,相关的技术文章真实屈指可数,而且很多文章都很旧了,里面使用的版本跟如今的EF6差别还是比较大.我刚开始弄这个的时候真是绕 ...

  6. dipole antenna simulation by FEKO

    新建变量 建立模型 设置频率 馈电设置为wire port ,Edge 选中振子,从中心馈电. 设置输入信号 Mesh. run solver.在post feko中查看相关结果

  7. 【Android Demo】悬浮窗体实现

    突然对悬浮窗体感兴趣,查资料做了个小Demo,效果是点击按钮后,关闭当前Activity,显示悬浮窗口,窗口可以拖动,双击后消失.效果图如下: 它的使用原理很简单,就是借用了WindowManager ...

  8. codeforces 577E E. Points on Plane(构造+分块)

    题目链接: E. Points on Plane time limit per test 2 seconds memory limit per test 256 megabytes input sta ...

  9. AC日记——手写堆ac合并果子(傻子)

    今天整理最近的考试题 发现一个东西叫做优先队列 priority_queue(说白了就是大根堆) 但是 我对堆的了解还是很少的 所以 我决定手写一个堆 于是我写了一个简单的堆 手写的堆说白了就是个二叉 ...

  10. [ORACLE错误]ORA-00054:resource busy and acquire with nowait specified解决方法

    当某个数据库用户在数据库中插入.更新.删除一个表的数据,或者增加一个表的主键时或者表的索引时,常常会出现ora-00054:resource busy and acquire with nowait ...