ArtDialog V6的简单使用
artDialog v6 —— 经典的网页对话框组件,内外皆用心雕琢。
兼容性
測试通过:IE6~IE11、Chrome、Firefox、Safari、Opera
授权协议
免费,且开源。基于LGPL协议。
支持开源
artDialog,献给那些愿意为 web 极致体验付出的人们!
四年来。有超过 40 万站点在使用 artDialog,当中不乏国内顶尖的产品:
在artDialog的使用中,使用较多版本号为4.1.7和6了,曾经我都是使用4.1.7版本号,所以来研究了一下v6版本号的使用。直接上代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <title>ArtDialog V6</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
--> <link rel="stylesheet" type="text/css" href="artDialog/css/ui-dialog.css"> <script type="text/javascript" src="jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="artDialog/js/dialog-min.js"></script> <script type="text/javascript">
function test1(){
var d = dialog({
title:'欢迎',
content:'欢迎使用 artDialog v6对话框组件。'
});
d.show();
} function test2(){
var d = dialog({
title:'欢迎',
content:'欢迎使用 artDialog v6对话框组件! '
});
d.showModal();
} function test3(obj){
var d = dialog({
content: 'Hello World!',
quickClose: true// 点击空白处高速关闭
});
d.show(obj);
} function test4(){
var d = dialog({
title: '欢迎',
content: '欢迎使用 artDialog 对话框组件! ',
ok: function () {},
statusbar: '<label><input type="checkbox">不再提醒</label>'
});
d.show();
} function test5(){
dialog({
button:[{
value: '允许',
callback: function () {
this
.content('你允许了');
return false;
},
autofocus: true
},{
value: '不允许',
callback: function () {
alert('你不允许')
}
},{
id: 'button-disabled',
value: '无效按钮',
disabled: true
},{
value: '关闭我'
}]
}).show();
}
</script>
</head> <body>
<input type="button" value="普通对话框" onclick="javascript:test1();">
<input type="button" value="模态对话框" onclick="javascript:test2();">
<input type="button" value="气泡浮层" onclick="javascript:test3(this);">
<input type="button" value="statusbar" onclick="javascript:test4();">
<input type="button" value="自己定义按钮组" onclick="javascript:test5();">
</body>
</html>
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbHVvMjAxMjI3/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbHVvMjAxMjI3/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">
有不懂,想要其它效果的能够去看看API,一切就都能够轻松搞定了
ArtDialog V6的简单使用的更多相关文章
- 网站对话框开源脚本--ArtDialog V6.0
初识对话框脚本觉得artDialog还是挺不错的开源的js脚本,最新版本都是V6.0 ,相对之前版本,artDialog的语法也发生很大的变化,windows对应的JS版本如下 点击下载 语法也发生变 ...
- artDialog ( v 6.0.2 ) content 参数引入页面 html 内容
/*! artDialog v6.0.2 | https://github.com/aui/artDialog */ 将页面某一隐藏的 div 的 html 内容传到 artdialog 的弹窗中,并 ...
- IP V4 和 IP V6 初识
IP V4 是互联网协议的第四版 地址长度为32位,4字节,用十进制表示 格式为:A.B.C.D 最大的问题在于网络地址资源有限,严重制约了互联网的应用和发展 IP V6 是互联网协议的I ...
- ArtDialog简单使用示例
<html><head><meta http-equiv="Content-Type" content="text/html; charse ...
- 让网站全面支持v4/v6 HTTP、HTTPS、HTTP/2最简单方法是增加Nginx反向代理服务器
bg6cq/nginx-install: nginx install script https://github.com/bg6cq/nginx-install [原创]step-by-step in ...
- artDialog 简单使用!
简介 artDialog是一个轻巧且高度兼容的javascript对话框组件,可让你的网页交互拥有桌面软件般的用户体验. 功能: 支持锁定屏幕(遮罩).模拟alert和confirm.多窗口弹出.静止 ...
- artDialog 简单几种用法
$('#btn1').click(function(){ artDialog({title:'图片查看', content:'<img width="817" ...
- FineUI(开源版)v6.0中FState服务器端验证的实现原理
前言 1. FineUI(开源版)是完整开源,最早发起于 2008-04,下载全部源代码:http://fineui.codeplex.com/ 2. 你可以通过捐赠作者来支持FineUI(开源版)的 ...
- AppBox v6.0中实现子页面和父页面的复杂交互
前言 1. AppBox是捐赠开源(获取源代码至少需要捐赠作者 1 元钱),基于的 FineUI(开源版)则是完整开源,网址:http://fineui.codeplex.com/ 2. 你可以通过捐 ...
随机推荐
- 发放福利:原价135元/年的阿里云CDN流量包(500GB)免费送
不少朋友看过本站推荐的两篇文章:1. <阿里云全民云计算活动:云服务器ECS二折起>2. <阿里云双11优惠活动-爆款云服务器> 大部分人都说不错,很快下单购买了服务器,后续使 ...
- js 切换全屏
公司有一个需求就是点击某一个按钮实现全屏切换功能,然后呢我就在网上扒了段代码.封装了一下.使用的小伙伴们可以看看哦! 切换全屏代码 <!DOCTYPE html> <html> ...
- Excel、Exchange 和 C# (摘要)
Excel.Exchange 和 C#Eric GunnersonMicrosoft Corporation 2003年4月21日 摘要:Eric Gunnerson 将向您介绍如何使用 Outloo ...
- python列表的一些常用方法以及函数
学习到了一些关于python列表的新知识,自己整理了一下,方便大家参考: #!/usr/bin/env python # _*_ coding:utf-8 _*_ # File_type:列表的常用操 ...
- gdb分析core文件
转载自:http://blog.chinaunix.net/u2/83905/showart_2134570.html 在Unix系统下,应用程序崩溃,一般会产生core文件,如何根据core文件查找 ...
- JAVA构造函数简析
构造函数是java新建对象的一种手段 构造函数可以重载 如果一个类中有多个域,那么就可能需要多个构造函数.这时候,使用重载就可以了 构造函数中this和super的使用 this:(1)this用于本 ...
- C# 排序技术研究与对比
一. 排序场景 一维数组排序 多维数组排序 集合排序,例如Dictionary ,List<T>, 自定义类集合排序等 DataTable排序 二. 排序实现和测试 1. 一维数组排序 1 ...
- spring装配Bean过程
主要流程: 1.读取配置文件 2.实例化bean和填充bean属性 这个粗略的流程感觉更像是一个需求,有了这个需求,那么spring内部是怎么处理的呢? 我们知道spring的两个核心接口BeanFa ...
- 照虎画猫写自己的Spring——依赖注入
前言 上篇<照虎画猫写自己的Spring>从无到有讲述并实现了下面几点 声明配置文件,用于声明需要加载使用的类 加载配置文件,读取配置文件 解析配置文件,需要将配置文件中声明的标签转换为F ...
- 【Java疑难杂症】有return的情况下try catch finally的执行顺序
有这样一个问题,异常处理大家应该都不陌生,类似如下代码: public class Test { public static void main(String[] args) { int d1 = 0 ...