JavaScript教程:网页浮动定位提示效果

核心提示： 需要的话还可以用options参数，来自定义触发对象的属性，JavaScript教程:网页浮动定位提示效果(3)，包括： 属性: 默认值//说明 ClickShow: true,//是否点击方式显示 ClickShowDelay: false,//是否点击显示延时 ClickHide: t

需要的话还可以用options参数，来自定义触发对象的属性，包括：

属性:　 默认值//说明

ClickShow:　 true,//是否点击方式显示

ClickShowDelay: false,//是否点击显示延时

ClickHide:　 true,//是否点击方式隐藏

ClickHideDelay: false,//是否点击隐藏延时

TouchShow:　 true,//是否触发方式显示

TouchShowDelay: true,//是否触发显示延时

TouchHide:　 true,//是否触发方式隐藏

TouchHideDelay: true,//是否触发隐藏延时

ShowDelay:　 300,//显示延时时间

HideDelay:　 300,//隐藏延时时间

vAlign:　 "clienttop",//垂直方向定位

Align:　 "left",//水平方向定位

Custom:　 { left: 0, top: 0 },//自定义定位

Percent:　 { left: 0, top: 0 },//自定义百分比定位

Adaptive:　 true,//是否自适应定位

onShow:　 function(){},//显示时执行

onHide:　 function(){}//隐藏时执行

具体作用后面再说明，可以在程序初始化时修改这些默认值。

一个经典应用是在onShow中把Tip修改为各个触发对象对应的内容。

此外还有Elem属性保存触发元素。

显示和隐藏：

提示效果的一个重点就是显示和隐藏提示信息。程序是通过设置Tip的visibility是否hidden来显示和隐藏Tip的。

具体的显示和隐藏程序分别在Show和Hide程序中，还有ReadyShow和ReadyHide程序，主要用来处理延时。

这种提示效果的一个特点是鼠标移动到Tip上时，会保持显示状态。

为了实现这个效果，给Tip的mouseover写入程序：

this.Check(e.relatedTarget) && clearTimeout(this._timer);