今天在做知灾害网站的时候碰到这样一个问题,在鼠标经过下面的小地图时,显示左边的小地图时,将出现一张较大的地图将小地图和可信度这部分覆盖,当鼠标移出较大的地图时,在还原回原来的样子。
但是当鼠标通过在边缘的小标签移出悬浮地图的时候,地图并不会隐藏,我分析了一下原因,因为小标签所在的层在地图所在层的上方,当鼠标通过小标签移出地图的时候,地图所在的图层感知不到鼠标动作,自然也就不会触发鼠标移出 事件处理函数。
有什么解决方案呢?一般情况下大家可能想这样解决:1.在鼠标移动的时候计算所标所在位置的坐标,如果超出了悬浮地图所在范围,则隐藏悬浮地图。(这种情况比较麻烦)
我是怎么解决的呢,我是给地图所在的层外面包裹了一个div,然后设定了几个像素的padding值,然后跟这个外层div绑定鼠标移出事件。现在当鼠标通过小标签移出地图时,地图不会隐藏的bug就解决了。