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

核心提示： this._fTH = BindAsEventListener(this, function(e) { if (this.Check(e.relatedTarget) && this.CheckHide()) { this.ReadyHide(this._trigger.TouchHi

this._fTH = BindAsEventListener(this, function(e) {
　　　 if (this.Check(e.relatedTarget) && this.CheckHide()) {
　　　　　　　 this.ReadyHide(this._trigger.TouchHideDelay);
　　　 }
});

不同的是mouseout在Check的时候是用e.relatedTarget。

触发原理：

上面是从程序的角度说明了触发显示和隐藏的过程，但要真正理解的话还需要做一次细致的分析。

下面是以触发方式的显示隐藏为例做的流程图：

下面是文字说明：

等待触发显示；

进入触发元素，如果设置延时，跳到3，如果没有设置延时，跳到4；

延时时间内，离开到外部元素，清除定时器，返回1，超过延时时间，跳到4；

执行显示程序；

显示Tip状态；

离开触发元素，如果是进入到Tip，跳到7，如果是离开到外部元素，跳到9；

保持显示状态；

离开Tip，如果是进入触发元素，返回5，如果是离开到外部元素，跳到9；

如果设置延时，跳到10，如果没有设置延时，跳到11；

延时时间内，如果进入Tip，清除定时器，返回7，如果进入触发元素，清除定时器，返回5，超过延时时间，跳到11；

执行隐藏程序，返回1；

再对照程序，应该就能理解整个流程了，当然可能还不是那么好理解。

这个流程也只是单例的情况，多例的时候还要多加一些判断。

可以说这个流程看似不难，但如果想做一个最优化的流程，那要考虑的细节地方可能会让人受不了。