1. 版本信息
目前的版本是 3.0.2 发布于2010-04-21
2. 注意事项
- lhgdialog目录是一个整体,不可破坏里面的目录结构,也不可对里面的文件改名,可以改目录名
- lhgcore.min.js文件为插件所用的库文件，此文件可放在其它任意目录里
- 各目录及文件的用途：
lhgcore.min.js：插件所用的库文件，此库的使用方法与jQuery差不多，可以说是个简化的jQuery，你可以在其它地方象使用jQuery一样使用它
lhgdialog.js：插件的核心文件，使用插件时要引入此文件，此文件是经过压缩的
lhgdialog.css：插件的样式表文件，此文件无需引入，插件会自动加载此文件
目录images：窗口插件所使用的图片的文件夹
index.html：示例说明文件，使用中不需要此文件，可删除
目录_content：内容页示例文件夹，示例中所需的内容页示例文件都在此文件夹中，使用中不需要此文件夹，可删除
目录_source：插件的核心文件lhgdialog.js和lhgdialog.css源文件，供大家学习使用的，此文件是未经过压缩的，可删除
3. 支持的浏览器
IE 6.0+ , Firefox 2.0+ , Chrome, Opera 9.5+ , Safari 3.0+
1. 插件所需文件的引入
使用lhgdialog弹出窗口插件要在你使用此插件的页面中引入
lhgcore.min.js和
lhgdialog.js，示例代码：
<head>
<script type="text/javascript" src="lhgcore.min.js"></script>
<script type="text/javascript" src="lhgdialog.js"></script>
</head>
注：lhgcore.min.js一定要在lhgdialog.js前引入
2. 加入主调函数
主调函数的语法为：J('#触发弹出窗口的按钮的id').dialog(
参数对象 ); 示例代码：
window.onload = function()
{
J('#test').dialog({ title:'lhgdialog', width:400, height:300, cover:true, page:'samples.html' });
}
或者换行写参数
window.onload = function()
{
J('#test').dialog({
title:'lhgdialog',
width:400,
height:300,
cover:true,
page:'samples.html'
});
}
注：主调函数要加在window.onload函数里或触发按钮元素的下面加<script>中，当然最好加在onload函数里，这样才能获取到触发弹出窗口按钮对象。
3. 关于在frameset框架集中的使用
在html中没有任何元素可以浮动在 frameset框架之上的，如果你想要弹窗浮动在 frameset之上， 你必须在 frameset 页面外层在加上 iframe 框架，
然后把frameset页面嵌入到这个iframe里就可以了，这也是目前所有解决 div层浮动在 frameset之上的可行方法。示例代码：
比如你的frameset页为
frame.html，代码为：
<frameset rows="80,*" frameborder="no" border="0" framespacing="0">
<frame src="about:blank" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" title="topFrame" />
<frame src="dialog.html" name="mainFrame" id="mainFrame" title="mainFrame" />
</frameset>
其中的dialog.html就为弹窗加载的页面。
这时我们就需要再新建一个index.html文件，里面代码为：
<body>
<iframe frameborder="0" style="width:100%;height:100%" src="frame.html"></iframe>
//这里的frame.html就为你的frameset页面
</body>
1. 主调函数参数
语法：
J('#触发弹出窗口的按钮的id').dialog( 参数对象 );
说明：#触发弹出窗口的按钮的id前面的#号不能少，这个和jQ的写法是一样的，主要说明一下参数对象，形式为json形式，键/值 对，所有参数如下：
- id：创建的弹出窗口的id，如果你的页面只弹出一个窗口的话，这个可以不写，默认为lhgdlgId。如果一个页面有多个弹出窗口，那这个属性就一定要写，而且不能重复。
- title：窗口标题，默认值为lhgdialog。
- width：窗口的宽度，直接写数值，默认值为400。
- height：窗口的高度，直接写数值，默认值为300。
- html：窗口的内容页为HTML代码，可以是HTML代码或DOM对象。
- page：窗口的内容页为一个单独的页面文件，这个文件的路径是内容页面文件相对于调用窗口插件的路径或也可使用绝对路径。
如果此参数的值为不同域的外部链接，那一定要使下面的link参数为真。
- link：是否为外部链接，如果是此参数一定要为真，不然程序会出错，默认值为false。
- cover：是否打开遮罩层,默认值为false。
- event：触发打开窗口的事件类型，默认为单击click。
- btns：是否显示窗口按钮栏，默认显示true。
- drag：是否允许拖动窗口，默认值为true。
- resize：是否允许拖动改变窗口大小，默认值为true。
- rang：是否在浏览器可视窗口内拖动，默认值false。
- top：窗口距浏览器顶端距离，如不写则窗口显示在屏幕中间。
- left：窗口距浏览器左边距离，如不写则窗口显示在屏幕中间。
- SetTopWindow：指定窗口弹出时的页面的window对象，如果是在框架中，你可以指定框架中的任意页面，如不指定则在框架的最顶层页面弹出。
- regDragWindow：注册拖动的页面的window对象，这个参数的作用就是拖动时如果滑过没注册的页面时会有停顿的感觉。
- parent：子窗口的父窗口对象，此参数只用在弹出的窗口中再弹出子窗口时指定父窗口对象，具体使用方法参照示例。
- cusfn：自定义函数，注意：只有内容页参数为html时，此参数才可以使用，而使用page参数时此参数不可用。
2. 内置函数说明
在使用内置函数前要先定义个对象的实例，如：var dialog = J('#id').dialog({ width: 400, height: 300 }); 此时dialog就是窗口对象的实例。
| 函数名 |
返回值类型 |
参数 |
描述 |
| cancel |
void |
无 |
关闭窗口函数 |
| reDialogSize |
void |
width：窗口的宽度
height：窗口的高度 |
重新指定窗口的大小 |
| addBtn |
void |
id：按钮的id
txt：按钮的文本
fn：按钮绑定的函数 |
创建新的按钮 |
| removeBtn |
void |
id：按钮的id |
移除窗口中的按钮 |
| reload |
void |
win：指定要刷新或跳转的页面对象
url：跳转的url地址 |
关闭窗口并刷新或跳转指定的页面 |
3. 内置对象说明
| 对象名 |
类型 |
描述 |
| dlg |
dom |
窗口元素DOM对象，可通过些对象对窗口和窗口内元素进行操作 |
| top |
window |
弹出窗口所在的顶层页面的window对象 |
| win |
window |
加载弹出窗口插件的页面的window对象 |
| opt |
参数对象 |
窗口的参数设置对象，例如：
var dialog = J('#id').dialog();
dialog.opt.title = 'test'; |
| inwin |
window |
如果内容页为一个文件时，此对象指的是内容页文件的window对象 |
| indoc |
document |
如果内容页为一个文件时，此对象指的是内容页文件的document对象 |
4. 在内容页中使用的对象
如果你的内容页不是单个的文件，也就是如果用的html参数就直接使用上面的函数和对象就行了，如果是一个单个的文件则要加个 dg. 这个是一个全局对象，代表弹出窗口的实例对象，使用方法请参照示例。
1. 常规功能
示例代码：J('#a').dialog({ title: '示例', width: 450, height: 350, cover: true, btns: false, rang: true, html: '<p>lhgdialog</p>' });
外部链接
示例代码：J('#b').dialog({ id: 'd1', title: '外部链接', page: 'http://www.google.com', link: true });
内部单独页面
示例代码：J('#c').dialog({ id: 'd2', title: '内部链接', page: '_content/01.html' });
在页面创建新按钮
示例代码：J('#d').dialog({ id: 'd2', title: '内部链接', page: '_content/01.html' });其它的代码请参照内容页里的代码
2. 其它功能
3. 各种内容页间的传值
插件目录中的_skin目录是插件提供的几款皮肤，由于窗口动态换肤的情况很少，也为了减少插件的大小，所以并没有提供动态换肤的功能。插件中的lhgdialog.css和images目录是皮肤
所用到的2个文件，你要想换肤的话，主要把_skin目录里相应皮肤的目录里的lhgdialog.css文件和images目录复制到插件的目录，覆盖原来的文件就可以了。如果你想自己制作皮肤，那
你只需要相应修改lhgdialog.css文件和images目录里的图片就可以了。