. 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. Combine small files to Sequence file

    Combine small files to sequence file or avro files are a good method to feed hadoop. Small files in ...

  2. jquery实现点击radio,当选中‘其它’时,显示后面输入框;否则隐藏

    有时候会遇到这么一个很简单的功能: jquery实现点击radio,当选中‘其它’时,显示后面输入框:否则隐藏 html代码: <div> <input type="rad ...

  3. UVA 12377 Number Coding --DFS

    题意:给一串数字,第一个数是Num的话,要使后面的数字组成Num个数,而且为不降的,将这Num个数分配到9个素因子上作为指数,问能组成多少个不同的数 解法:dfs一遍,看后面的数字能组成Num个不降数 ...

  4. Android配置----adb工具的使用

    Adb(android debug bridge):android 调试桥,用于将本地的文件 push 到环境中,或者从手机环境中 pull 文件到本地. 一.ADB的主要功能: · 运行设备的she ...

  5. uGUI练习(三) KeyBoard Navigation

    练习目标 练习通过键盘在按钮或其它Selectable类型组件上导航 步骤 创建一排的Button,及一个右边的Button 2.查看Button的属性里有一栏下拉列表Navigation,默认选择的 ...

  6. EZ GUI Button和Checkbox创建

    第一次接触EZ GUI,记录学习过程 准备工作 导入资源 导入 EZ GUI 1.0795.unitypackage 和 SpriteManager2 v1.92.unitypackage EZGUI ...

  7. android app多渠道分发打包

    1.  美团多渠道包的方法论 1) maven编译多次 2) apktool一次包,解开重新打  (个人倾向于这个) 3) http://tech.meituan.com/mt-apk-packagi ...

  8. c#解决窗体假死的一种方法

    public partial class Form1 : Form { public Form1() { InitializeComponent(); } private void button1_C ...

  9. ArcGis实现添加MultiLayerMarkerSymbol(多个符号叠加生成新的符号)

    , , );             pMarkerSymbol.Angle = ;             pMarkerSymbol.XOffset = ;;;;, , );            ...

  10. 10301 MySQL各个版本区别及下载

    参考:http://www.admin10000.com/document/62.html MySQL 的官网下载地址:http://www.mysql.com/downloads/ 在这个下载界面会 ...