jQuery探测位置的提示弹窗（toolTip box）

提示弹窗（toolTip box）经常会被用到，这里总要的不是弹，也不是窗，而是探测位置，在适当的地方弹窗。
这里我用jQuery做了个提示弹窗的js，并做了个小demo，简单总结下：

方位

根据当前鼠标所处的位置不同，箭头所指向的方向也不同：

左上方（left-top）（缺省）、左下方（left-bottom）、右上方（right-top）、右下方（right-bottom）、上左方（top-left）、上右方（top-right）、下左方（bottom-left）、下右方（bottom-right）



优先级



以上各种情况优先级依次降低

探测思路

探测基本思路是:

首先，也是前提条件，判断容器的高或宽是否是弹窗对应的高或宽的两倍，之所以是两倍，因为临界点是目标容器的各个边的中点


接下来，可以依据优先级去逐个判断：

具体情况判断：

根据优先级，先判断鼠标右侧能否放下弹窗:

能放下，则去判断能否再放进个箭头

若能放下

则判断顶部是否能放下个箭头，包括箭头的偏移量，若能

判断顶部能放下箭头包括偏移量并且不会超过目标容器高度，则为left-top
否则如果顶部大于弹窗高度，并底部可放下箭头包括其偏移量，则为left-bottom
否则，判断底部能放下箭头和弹窗，则为top-left
否则，基于我们的前提条件，是bottom-left

若不能放下，判断底部能不能放下弹窗和箭头

能，则为top-left
否则，为bottom-left

不能放下，则left考虑完，换right，同样的思路

八种情况弹窗的情况和位置

举例top-left

八种情况下箭头的情况和位置

同样以top-left为例


最后说下在写代码时候的些许感悟：

写的代码，在重构了N遍，写完N行注释后，忽然想到，其实不论是写代码，还是生活，我们都是有个既定的或者约定俗成的前提或者说规范的。而一旦这个规范被打破，往往前功尽弃，即使不是，往往也很受伤。实例小至代码、大至社会，无一例外