`
wang371134086
  • 浏览: 128631 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

artdialog

阅读更多

 

<!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();

   }

 

 

 

 

 

 

  • js.rar (43.7 KB)
  • 下载次数: 63
分享到:
评论

相关推荐

    artDialog.js的demo

    **artDialog.js** 是一个流行的JavaScript对话框插件,它为网页应用提供了强大的弹出框功能。这个"artDialog.js的demo"包含了4.15版本的资源,旨在帮助开发者了解和使用artDialog的各种功能。 在提供的文件列表中,...

    artDialog经典优雅的网页对话框控件

    **artDialog:经典优雅的网页对话框控件** 在网页设计和开发中,对话框控件扮演着重要的角色,它们通常用于向用户显示警告、询问信息或者提供交互式的操作界面。`artDialog`是一个非常出色的JavaScript插件,专门...

    artDialog插件和API详解

    **artDialog插件和API详解** `artDialog`是一款强大的JavaScript弹出对话框插件,它为网页开发者提供了丰富的交互式对话窗口功能。这个插件以其优雅的样式、灵活的配置选项以及强大的API,被广泛应用于网页中的提示...

    artDialog对话框插件 4.0版

    《深入理解artDialog对话框插件 4.0版》 在网页开发中,弹出对话框是常用的功能之一,它用于提供一种与用户交互的方式,展示信息、获取输入或者执行某些操作。artDialog是一款优秀的JavaScript对话框插件,其4.0...

    jquery 弹出框插件artDialog

    **jQuery弹出框插件——ArtDialog** ArtDialog是一款基于jQuery的高级对话框插件,它为网页开发者提供了丰富的弹出框解决方案。ArtDialog不仅功能强大,还具有良好的易用性和可扩展性,使得在网页中创建各种类型的...

    artDialog4.1.7.zip 和自己写的Demo

    "artDialog4.1.7.zip 和自己写的Demo" 这个标题和描述提及了两个关键元素:artDialog4.1.7.zip 和一个自编写的Demo。显然,这是一个关于artDialog对话框插件的项目,其中包含了4.1.7版本的源代码和一个用户或开发者...

    ArtDialog弹窗与API

    **ArtDialog弹窗插件与API详解** 在Web开发中,弹窗是一种常见的交互元素,用于展示信息、警告、确认操作或收集用户输入。ArtDialog是一款功能强大的JavaScript弹窗插件,它以其丰富的定制选项、良好的用户体验和...

    artDialog的js,css与事例

    例如,你可以修改`.artDialog`、`.artDialog-body`、`.artDialog-title`、`.artDialog-inner`等类来改变对话框的尺寸、标题样式、内容区域和按钮栏。 在实际使用中,我们通常会通过引入JS和CSS文件来初始化...

    artdialog 二次开发

    **artdialog 二次开发** 在Web开发中,用户交互界面的体验往往直接影响到产品的质量和用户满意度。`artdialog`是一个非常流行的JavaScript对话框插件,它提供了丰富的自定义选项和良好的可扩展性,使得开发者能够...

    jquery实现弹出框artDialog

    artDialog

    artDialog5 强大的消息对话框

    `artDialog5`是一款强大的JavaScript对话框插件,专为网页应用设计,用于创建各种类型的消息对话框,如提示、警告、确认、错误等。它以其灵活性、可定制性和高性能在IT行业中广受青睐。在描述中提到,用户对原版`...

    artDialog2.0.6,一个漂亮的可以代替alert()的js特效

    此时,艺术对话框(artDialog)应运而生,特别是artDialog2.0.6版本,以其美观的界面和丰富的功能,成为了开发者们喜爱的替代方案。 **一、artDialog简介** artDialog是一个开源的JavaScript对话框插件,由国人...

    artDialog,demo,iframe

    artDialog 是一个JavaScript弹出对话框插件,而 "demo" 指示这是一些示例代码,用于展示如何使用 artDialog。"iframe" 提及的是在这些示例中可能使用到的技术,即在对话框内嵌入页面框架。 **描述分析:** 描述中...

    弹窗插件artDialog4.1.3

    **弹窗插件artDialog4.1.3详解** artDialog4.1.3是一款优秀的JavaScript弹窗插件,广泛应用于网页交互设计中,提供了一种高效、灵活的方式来创建各种类型的对话框。它具备良好的浏览器兼容性,支持IE6及以上的版本...

    artDialog 弹出层插件(4星级)

    `artDialog`是一款在前端开发中广泛使用的弹出层插件,它以其高度可定制性、优雅的设计和良好的用户体验赢得了4星级的评价。本文将深入探讨`artDialog`的核心特性、使用方法以及常见应用场景,帮助开发者更好地理解...

    artDialog4.1.5.rar

    **artDialog 4.1.5 - 精致的页面对话框组件** **一、artDialog简介** artDialog是一款高效、轻量级且功能强大的JavaScript对话框组件,专为网页应用而设计。它以其优雅的界面设计和灵活的扩展性在IT行业中赢得了...

    artDialog弹出模式窗API

    `artDialog弹出模式窗API`是一款在Web开发中广泛应用的JavaScript库,它为开发者提供了丰富而强大的对话框功能。这个API允许你创建各种类型的弹出窗口,包括但不限于提示、确认、询问等,使得网页交互更加直观且美观...

    artDialog4.1.7 永久版弹出框

    **artDialog4.1.7 永久版弹出框** `artDialog`是一款流行的JavaScript弹出对话框插件,适用于网页中的各种提示、确认、消息框等场景。其4.1.7版本提供了丰富的功能和良好的用户体验,是前端开发者在构建交互式Web...

    模态窗体(artDialog4.1.7)

    本文将深入探讨“artDialog4.1.7”这一组件,它是一款轻量级、高效的模态对话框解决方案。 **artDialog** 是一个非常小巧的Web对话框组件,压缩后的大小仅为十多KB,这使得它在加载速度和资源占用方面具有显著优势...

Global site tag (gtag.js) - Google Analytics