为什么想写此插件，想来想去，归结为一个字：“懒”。不想为明明两个类似的功能分别写代码，本应喝茶看美女的休闲时光晃荡在本可避免的代码上，对于我来讲，就是白白耗费自己的青春。于是，干脆，一鼓作气，把这些类似的功能集合到一起，一个插件搞定，一了百了了。这种感觉就好比《大话西游》里悟空一巴掌拍死唐僧这只苍蝇一样。那，这里提及的类似的功能是指？当当当当，就是与某元素有位置关系的浮动层（例如tip类效果，鼠标经过显示大图，下拉列表等）。
插件名为jquery-powerFloat.js。//zxx:之前我喜欢用”.”连接，后发现在使用combo合并脚本的时候会出问题，于是，现在使用”-”连接名称了。
支持hover, click, focus以及无事件触发；支持多达12种位置的定位，出界自动调整；支持页面元素加载，Ajax加载，下拉列表，提示层效果，tip类效果等；可自定义装载容器；内置UI不错的装载容器；支持鼠标跟随等。
三、demo及下载demo
您可以狠狠地点击这里：万能浮动插件powerFloat测试页面
下为demo页面中鼠标经过显示大图效果截图：
下载
JS文件下载：jquery-powerFloat.js(未压缩) 或 jquery-powerFloat-min.js(压缩)
zip打包下载：jquery-powerFloat.zip
//zxx:下载均右键 – [目标|链接]另存为
四、如何使用使用很简单，统一的模式，就是$(选择器).powerFloat({..});具体使用如下：
假设此时页面上有个链接，其HTML如下：
则：
如果要用几个关键词来概括此插件，无非就是触发元素(trigger，也就是选择器绑定对象)，触发事件(API中的eventType)，浮动元素(target，各种方式获取的元素)，定位(target的定位)。下文中，trigger一词就是指触发元素，target指浮动元素。
由于插件集合的功能较多，所以使用规则稍微多了点，具体可参见下面的API表格展示，之后的详细解释。这里就不多说了。
五、API参数(create by zhangxinxu 2010-12-15)
六、API参数详解插件可以实现的功能多了，支持的事件多了，又要有精炼的API，API的使用规则自然而然也就多了，复杂了。但是，一旦了解这些规则后，工作就将变得异常轻松，你会发现生活原来如此美好。
1. width
宽度值，与CSS中的width属性的些值是一样的。
这里的width也是可以是”auto”(默认)，”inherit”，以及具体的宽度值。但是，有所不同的是这里的”inherit”，继承的不是父标签的宽度，而是继承的触发元素的宽度。举个例子，我鼠标移动一个a标签的文字链接上，结果显示了浮动层，如果此时width参数设置的值是”inherit”，则浮动层的宽度就是这个a标签的宽度。此属性在等宽下拉列表下非常有用。
2. offsets
相对于目标位置的偏移值。默认是{x:0, y:0}，其中x表示水平方向偏移，y表示垂直方向偏移。根据浮动层(target)与触发元素(trigger)的位置不同，offsets的偏向也是不同的，左侧位置和上部位置offsets是向左上方偏移，而要是浮动层和触发元素在右侧和下方位置接触，则offsets值表示右下方的偏移，大致意思如下图所示：
其实只要意识到这里的offsets偏移是以触发元素(trigger)为参考点进行偏移就可以了。trigger位置固定，target相对偏移，以trigger为中心，辐射状偏移。举个例子吧，如果offsets.x = 10，那么要是浮动层在右侧，则右偏移10像素，要是浮动层在左侧则左偏移10像素。
3. zIndex
浮动层的层级，浮动层都是采用的绝对定位，所以有层级，默认大小为999。插件自带的UI中的小三角也是绝对定位，其层级比浮动层高一级，所以，小三角默认层级是1000.
4. eventType
事件类型，一般而言，此参数无非这几个：”hover”(默认), “click”, “focus”以及null，其中”hover”表示鼠标悬停和移出事件，”click”表示点击事件，”focus”表示获得焦点事件，适用于表单元素，null表示无事件，也就是trigger绑定了powerFloat方法即触发，此参数在点击A元素，但是让B元素上显示提示上很有用。
5. showDelay
显示延迟。只有当eventType为”hover”时此参数才有用，”click”, “focus”都是无延迟执行的。单位毫秒，当为大于0的整数时生效（使用可参见demo中自定义Tip效果）。
6. hideDelay
鼠标移出延迟。只有当eventType为”hover”时此参数才有用。其中有两种情况下默认是有hideDelay的，一是当hoverHold参数为true的时候，会有200毫秒的隐藏延迟；另外一种情况就是eventType为”focus”时，失去焦点隐藏，也是有200毫秒的延迟关闭（保护点击事件）。
7. hoverHold
当鼠标经过浮动层时浮动层是否依然显示。只有当eventType为”hover”时此参数才有用。如果为false，则表示鼠标一旦离开trigger(触发元素)，则target(浮动元素)隐藏（使用可参见demo中自定义Tip效果）。
8. hoverFollow
是否鼠标跟随。参数可以是false，true以及关键字”x”, “y”，其中false为默认值，表示不鼠标跟随，”x”表示仅水平方向鼠标跟随，”y”表示仅垂直方向，无论是”x”还是”y”，浮动层都不会与触发元素发生重叠的，只是单向的位置移动。但是，如果hoverFollow为true，则是真正意义上的鼠标跟随，target的左上角会紧随鼠标，也会与trigger发生重叠，注意，此时应该设置一定的offsets值，否则会因为与鼠标位置过近的原因，反复触发鼠标移入移出事件，要是浏览器性能不够好，小心页面被晃荡掉。
9. targetMode
浮动层类型。字符串参数。内置关键字参数有：”common”, “ajax”, “list”, “remind”。其中”common”为默认，表示加载页面上的元素，元素就是浮动层本身；”ajax”就是加载外部元素，例如图片，HTML片段等，默认使用内置的容器，含loading效果；”list”专门用作下拉列表；”remind”是提示，内容只能是文字或是含有HTML代码的字符串。此插件强大之处就是您可以自定义浮动层类型。例如，在demo中，我自己自定义的tip类型，如何定义，如何写样式完全取决于您的设计与页面需求。然后，定位，装载等全部交给插件，这个后面还会单独讲述。
10. target
非常重要与最常用的一个参数，是浮动层的内容来源，甚至就是浮动层本身(targetMode为common的部分情况)。默认是null，由于target参数是插件两个浮动层内容获取来源之一，且是优先获取来源，所以，当target为null时，插件会从下一个参数targetAttr获取内容。根据targetMode参数不同，target的类型也是跟着变化的。
11. targetAttr
另外一个获取浮动层内容的途径，如果说是target参数是显式获