MagicDialog 发布!方便扩展和样式自定义。详细内容请访问
http://www.boarsoft.com
<script type="text/javascript">
$(function(){
$('.dlgDemoBtn').click(function(){
var el = $(this), act = el.attr('action');
switch(act){
case 'basic':
$('<div></div>').mac('dialog',{
title: 'Hello!',
model: true,
autoOpen: true,
width: 200,
draggable: true,
el: '<p>Hello world!</p><p>I\'m MagicDialog!</p>'
});
break;
case 'extended':
mac.opendlg({
title: 'Hello!',
message: 'Press {0} can close me.',
params: ['<b>ESC/Enter</b>'],
buttons: [{
text: 'OK',
click: function(d){
d.close();
}
}]
});
break;
case 'wait':
var h = mac.wait('Count 3 sec to close.');
window.setTimeout(function(){
h.close();
}, 3000);
break;
case 'alert':
mac.alert('Hello!');
break;
case 'confirm':
mac.confirm('<p>Are you sure?</p>', function(){
alert('You clicked yes!');
}, null);
break;
case 'customize':
mac.confirm('<p>Are you sure?</p>', null, null, [{
text: 'Close',
click: function(d){
d.close();
}
},{
text: 'Yes, I\'m sure?',
click: function(d){
d.close();
}
}]);
break;
}
});
});
</script>
<button class="dlgDemoBtn" action="basic">Basic</button>
<button class="dlgDemoBtn" action="extended">Extended</button>
<button class="dlgDemoBtn" action="wait">Spinner</button>
<button class="dlgDemoBtn" action="alert">Alert</button>
<button class="dlgDemoBtn" action="confirm">Confirm</button>
<button class="dlgDemoBtn" action="customize">Customize</button>
- 大小: 4.4 KB
分享到:
相关推荐
本文将深入探讨“简约扁平风格jQuery确认对话框插件”,这是一个高效且设计精良的工具,旨在增强用户体验,为网站或应用程序添加优雅的确认对话框。 首先,我们来理解“确认对话框”的概念。在用户界面设计中,确认...
本篇文章将详细讲解一个特定的jQuery插件——"jQuery确认对话框插件",它是JavaScript开发中用于创建模态框和弹出框的一种工具。 在Web应用程序中,确认对话框通常用于在用户执行关键操作(如删除数据或离开页面)...
SweetAlert2是一款强大的jQuery模态对话框插件,它的出现是为了替换浏览器中常见的、功能单一的弹出对话框。在网页交互设计日益丰富的今天,SweetAlert2为开发者提供了更加美观且可定制化的提示信息,提升了用户体验...
**jQuery弹窗对话框插件**是基于JavaScript库jQuery的一款实用工具,主要用于增强网页的用户交互体验。在网页设计和开发中,对话框通常用于显示警告、确认信息、或者进行多步骤操作,而这款插件提供了丰富的功能和...
jDialog是针对jQuery设计的一款轻量级模态对话框插件。模态对话框在网页应用中常用于提示信息、确认操作或显示详细内容,它可以阻止用户与页面其他部分的交互,直到对话框被关闭。jDialog的特点在于其提供了四种不同...
"jQuery确认对话框窗口弹窗插件"就是为了解决网页中需要用户确认操作时的一个常见需求,如删除、保存等关键操作前的二次确认,提供了一个方便的解决方案。 这个插件的核心功能在于它能够创建一个模拟系统级确认...
`jDialog`是一款基于jQuery的对话框插件,它提供了丰富的功能和自定义选项,使得创建各种类型的对话框变得简单而直观。 1. **jQuery基础** `jQuery`是一款轻量级的JavaScript库,它简化了DOM操作、事件处理、动画...
jQuery Mobile 提供了基础的对话框功能,但为了满足更复杂的需求,开发者们通常会寻找更为定制化的解决方案,如 "Mobile-SimpleDialog" 这款 jQuery 移动对话框插件。 **1. 插件介绍** "Mobile-SimpleDialog" 是一...
1. 引入jQuery库和对话框插件:在HTML文件中,需要引入jQuery库和对话框插件的JS及CSS文件。 2. 初始化对话框:在DOM加载完成后,通过JavaScript调用对话框插件的初始化方法,设置对话框的基本属性,如宽度、高度、...
jQuery Dialogbox是一款基于jQuery库的扁平化设计对话框插件,它提供了丰富的对话框样式和功能,适用于各种用户交互场景。以下是对该插件及其相关知识点的详细说明: 1. **jQuery基础**:Dialogbox是jQuery的一个...
jquery 仿模态对话框插件 演示: http://blue.bokequn.cn/demos/modalbox/demo/demos.html 主要功能: 1, 模态化显示(背景内容不可编辑) 2, 限制在窗口内拖动. 3, 窗口标题,确定,取消按钮可选择显示与否. 4, ...
**jQuery模态对话框插件jAlert** 在Web开发中,模态对话框是一种常见的交互元素,用于向用户展示重要信息或获取用户输入。jAlert是基于jQuery的一个轻量级插件,它允许开发者轻松创建功能丰富的模态对话框,支持...
在这个场景中,我们关注的是一个基于jQuery的简单确认对话框插件,这个插件允许开发者在用户点击时弹出提示对话框,以增加用户交互的体验。 确认对话框通常用于在用户执行关键操作前进行确认,如删除数据或离开页面...
jQuery dialog对话框插件是jQuery UI库中的一个核心组件,用于创建可自定义的模态或非模态对话框。这个插件提供了丰富的功能,包括拖动、调整大小、自动定位以及多种主题样式,使开发者能够轻松地在网页中添加交互式...
在 jQuery 中,实现模式对话框通常依赖于第三方插件,如 jQuery UI 中的 Dialog 组件。尽管 jQuery 自身并不内置对话框功能,但通过与其他库结合,可以轻松创建出功能丰富的对话框效果。 首先,你需要引入 jQuery ...
Zebra_Dialog是一款简单实用的jQuery模态对话框插件。用它可以替代原生JavaScript的警告框和确认框,也可以用它来制作消息提示框。它兼容IE6 浏览器,支持Ajax加载内容和iFrame框架等。
Zebra_Dialog是一款简单实用的jQuery模态对话框插件。用它可以替代原生JavaScript的警告框和确认框,也可以用它来制作消息提示框。它兼容IE6+浏览器,支持Ajax加载内容和iFrame框架等。
而jQuery UI则是在jQuery基础上扩展的一套用户界面组件库,包括对话框(Dialog)、拖放(Draggable)、可排序(Sortable)等。 ### 2. 引入jQuery和jQuery UI 首先,确保在HTML文件中引入了jQuery库和jQuery UI库...