<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>art</title>
<link id="artDialogSkin" href="skins/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="artDialog.js"></script>
<script type="text/javascript" src="iframeTools.js"></script> <!-- 对iframe的新工具 -->
<script type="text/javascript" src="jquery.min.js"></script> <!-- 对iframe的新工具 -->
</head>
<body >
<script type="text/javascript">
function a(){
art.dialog({content:'hello world!历史'})
}
function b(){
art.dialog(
{
content:'欢迎你来到对话框世界！',
lock:true,
style:'succeed noClose'
},
function(){
alert('你点了确定'); //不管点了确定还是取消默认都会关闭artdialog，除非在这里面返回false
},
function(){
alert('你点了取消');
}
);
}
function c(){
art.dialog(
{
title:'图片查看',
fixed:true,
content:'<img width="817" height="479" src="butterfly.jpg" />'
});
//return false;
};
function d(){
// art.dialog({title:'dialog内嵌iframe', iframe:'http://www.baidu.com', width:'900', height:'500'});
//已经没有了直接的iframe属性 通过下面的方式内嵌iframe 第二种效果不佳
art.dialog.open("iframe.html", {width: 320, height: 400});
// art.dialog({title:'dialog内嵌iframe', width:'900px',height:'500px', content:"<iframe align='right' src='http://www.baidu.com' width:'100%' height:'100%' />"});
return false;
};
function e(){
art.dialog(
{
title:'动画',
fixed:true,
content:'<embed src="ddd.rm" type="audio/x-pn-realaudio-plugin" autostart="true" width="420" height="363"></embed>'
});
}; //播放avi总是只有声音，没有画面，哎！
function f(){
art.dialog({content:'你人品稳定么？', fixed:true, yesText:'我很稳定', style:'confirm', id:'bnt4_test'},
function(){
art.dialog({id:'bnt4_test'}).content('你骗人！');
return false;//这样对话框才不会关闭
},
function(){alert('你是坏人');}//按右上角的叉关闭对话框也会执行这个函数
);
};
function g(){
art.dialog({mouse:true, id:'dg_test34243', content:'您收到 <strong>2</strong> 条消息',left:'right',width:'15em', top:'bottom', fixed:true});
};
function h(){
art.dialog({id:'dg_test34243'}).close();
};
function i(){
var _this = document.getElementById('btn7');
if (document.getElementById('menu_4834783')) {//如果已经打开了对话框，按这个按钮还能把它关闭
art.dialog({id:'menu_4834783'}).close();
_this.innerHTML = '弹出菜单'; //button上显示的内容
return;
};
art.dialog({id:'menu_4834783', title:'菜单', content:'请输入：<input style="width:200px;" id="M_dfd" type="text" value="hello world!" />',
button:[{name:'确定',callback:function(){
var a=document.getElementById('M_dfd').value;
art.dialog({content:a, lock:true, time:1});
}
},
{name:'关闭我',callback:function(){_this.innerHTML = '弹出菜单';}}
]
}
);
_this.innerHTML = '关闭菜单';
return false;
};
</script>
<input type="button" style="width: 100px" onClick="a()" value="最简单的对话框"/><br/>
<button id="btn0" onClick="b()">基本示例</button><br/>
<button id="btn1" onClick="c()">显示图片</button><br/>
<button id="btn2" onClick="d()">外部页面</button><br/>
<button id="btn3" onClick="e()">视频</button><br/>
<button id="btn4" onClick="f()">询问</button><br/>
<button id="btn5" onClick="g()">广告</button>
<button id="btn6" onClick="h()">关闭</button><br/>
<button id="btn7" onClick="i()">弹出菜单</button><br/>
<input type="text" value="" id="fa"/>
</body>
</html>
-----------------------子页面传值给父页面--------------------------------------------------
function click_(url,id){
//将图片路径传递给父页面
artDialog.open.origin.document.getElementById('customerpicurl').src=url;
//图片ID传递给父页面
artDialog.open.origin.document.getElementById('customerpicid').value=id;
art.dialog.close();
}
分享到：
相关推荐
artDialog
artDialog下载的4.15资源的下载。
artDialog——经典、优雅的网页对话框控件
artDialog插件的使用和相关API详解
artDialog对Iframe支持的最后一版，个人觉得比6.0好用
artDialog是一个精巧的web对话框组件，不依赖其他框架。artDialog的特殊布局结构能够原生的适应内容变化，你不必像以前一样去考虑消息内容大小，她能自己去适应内容。当然她仍然可以接受一个固定高宽的参数，她能够...
完整的artDialog包，artDialog是一个非常好用，方便的弹出框插件，容易掌握
artDialog4.1.7.zip 和自己写的Demo
artDialog5 强大的消息对话框 自己修改了一下样式，提示框加了一些提示、成功、错误等图片
依赖artdialog5.0.4，在此基础上进行二次开发，规范弹出框样式及内容，压缩包内有QQ截图为效果图，js文件中有注释，请参见showNormalDialog方法
artDialog 弹出层插件
artDialog是一个轻巧且高度兼容的javascript对话框组件，可让你的网页交互拥有桌面软件般的用户体验。 功能： 支持锁定屏幕(遮罩)、模拟alert和confirm、多窗口弹出、静止定位、支持Ese键关闭对话框、定时关闭、...
牛逼的artdialog 前端弹窗框架 用起来很爽
artDialog2.0.6，一个漂亮的可以代替alert（）的js特效
ArtDialog代码插件与api，非常强的的弹窗插件~
在artDialog(6.0.0)原始压缩版dialog-plus.js的基础上，增加了对话框的两个选项： 1、【esc】：是否点击键盘[Esc]键退出（默认true）； 2、【drag】：是否允许用户拖拽（默认true）；
自己写的一些小例子，代码清晰明了易懂， 使用json格式交互，套用artDialog漂亮的窗口, 使用SSH框架
artDialog-v4.1.7默认皮肤美化版。在官方原版的基础上美化了默认的皮肤，变得简单却高端
artDialog 是一个设计得十分巧妙的对话框组件，小巧身材却拥有丰富的接口与漂亮的外观。
artDialog的特殊UI框架能够适应内容变化，因此你不必去考虑消息内容尺寸使用它。当然它仍然可以接受一个固定高宽的参数，它能够防止内容溢出或截断，同时也不会产生难看的滚动条；它的消息容器甚至能够根据宽度让...