最近在做项目的时候需要对很多的页面进行改造，将已有的页面已div的形式弹出来，自己在网上找了很多jQuery的插件但是都觉得不够好，最后发现了一个国产的插件“artDialog”还不错(支持国产 啊:D )，使用很简单、上手快、API全！
一、下载
地址：http://code.google.com/p/artdialog/downloads/list
在这里可以获取到最新版本的artDialog，目前最新版本是4.1.2
二、应用到项目
1、将下载的zip包解压后整体copy到项目中
2、在页面head引入一个js文件
官网地址：http://www.planeart.cn/demo/artDialog/index.html
我只是说下大致怎么使用，里面有很多用法和效果，请参考下官方的api文档
先说下目录结构吧
我的目录结构是：
dialog
---artDialog.js
---test.html
skin
---default.css
---green.css
--- ......
然后，在head里引入js文件
Javascript代码 ![收藏代码]()
- <script src="artDialog.js?skin=default"></script>
- //后面的是指使用default皮肤，当前目录下的skin目录下面
Javascript代码 ![收藏代码]()
- function test(){
- art.dialog({
- content: 'Test artDialog'
- });
- }
Html代码 ![收藏代码]()
- <a href="javascript:" onclick="test();">测试</a>
全文：
Html代码 ![收藏代码]()
- <html>
- <head>
- <title>test artdialog</title>
- <script src="artDialog.js?skin=default"></script>
- <script type="text/javascript">
- function test(){
- art.dialog({
- content: 'Test artDialog'
- });
- }
- </script>
- </head>
- <body>
- <a href="javascript:" onclick="test();">测试</a>
- </body>
- </html>
大家试下效果吧。
当你要Open一个网页,或Load,导入iframeTools.js
更多资源:
http://www.planeart.cn/demo/artDialog/_doc/API.html
http://www.planeart.cn/demo/artDialog/_doc/plugin.iframe.html
http://imshare.iteye.com/blog/823859
http://yeyuan.iteye.com/blog/1236279