jquerytools之overlay

所谓overlay，就是浮层。就是那种在当前页面弹出的一个新的层。它可以作为对话框的容器、图片展示容器、播放器容器等等。

废话少说，直接切入正题。

使用：

// select one or more elements to be overlay triggers
$(".my_overlay_trigger").overlay({

	// one configuration property
	color: '#ccc',

	// another property
	top: 50

	// ... the rest of the configuration properties
});

上面这段代码，在拥有.my_overlay_trigger的元素上绑定了overlay特性，使它们成为了overlay的触发器。

触发器是有着落了，可是还没有用于显示的内容啊，即overlay的载体本身还没有的。默认，jquerytools会找触发器元素中是否指定了rel属性（值为jquery选择子，指向另一个元素），如果指定了，就自动将那个元素做为overlay的容器。而如果没有rel属性的话，就得在上面的代码中指定target属性了，需给target赋予一个jquery对象。

overlay属性

属性名称	属性值	解释
close	jquery对象值。可省	指定用于关闭的元素，给自动给那个元素绑定一个鼠标单击事件，点击之后，关闭此overlay。当此属性省略时，会自动在overlay容器里面找有.class类的元素。
closeOnClick	true or false，默认为true	指定当点击overlay的外部区域时，是否自动关闭这个overlay，默认是关闭。设置为false的话，就定义了一个modal overlay
closeOnEsc	true or false，默认为true	指定当按了键盘上的esc键时，是否关闭当前这个overlay。如果设置为false，按esc将不起作用。
effect	特效名，目前可用的有：'default', 'apple'	定义overlay弹出时的动画效果
fixed	true or false，默认为true	指定overlay是不是相对于浏览器可见容器固定，默认为固定。设置为false的话，当页面可以向下滚动时，overlay的显示位置将不再固定
mask	遮罩参数，详见expose说明文档	指定是否带一个遮罩。如果不指定此属性，就没有遮罩。遮罩能带来比较好的视觉效果
left	'center' or 具体数值，单位是px	指定overlay弹出后，放的位置
load	true or false，默认为false	指定，当在触发子上进行绑定overlay之后，是否立即执行显示效果，即把overlay弹出来
oneInstance	true or false，默认为true	指定当前页面是否只允许有一个overlay出现，jquerytools overlay本身是支持多个overlay在同一个页面出现的情况的
speed	'norma', 'slow', 'fast' 或 一个数值（以毫秒为单位）	指定overlay弹出的速度，指定为0后，就立即弹出
target	一个jquery对象	指定承载这个overlay的容器，一般是一个<div>
top	数值、或百分比字符串 'n%'，或'center'	用于指定当overlay弹出时，在浏览器可见区域内的位置

事件回调函数

回调函数名称	调用时机
onBeforeLoad	overlay显示之前调用。不过这个时候，overlay本身的位置已经确定下来了
onLoad	当overlay已经完全被显示出来之后调用
onBeforeClose	在此overlay被关闭之前调用
onClose	在此overlay被关闭之后调用

每个回调函数都会收到一个jQuery.Event对象作为第一个参数传入。

对象编程API
被绑定的trigger，将会拥有一套API可以使用。这个API可以通过

var api = $(".my_overlay_trigger").data("overlay");

获得。

对于overlay来讲，它可以赋予触发器如下API。

方法名称	返回值	功能
close()	此overlay数据对象	关闭本overlay
getClosers()	jquery对象	获得本overlay中的close对象
getConf()	js对象	获得本overlay的配置属性
getOverlay()	jquery对象	得到overlay容器对象
getTrigger()	jquery对象	得到此overlay的触发器对象，一般就是自己了
isOpened()	true or false	检测当前overlay是打开的，还是关闭的
load()	此overlay数据对象	打开此overlay

如上，即是overlay的基本的参考内容了。后面，会补上一些经验性质的东西。并且，本身这上面还有几个疑点还没澄清。API中，返回“overlay数据对象”这到底是什么东东？需要通过测试来弄清楚。