Question

我的网站上有Bubbling事件的问题。至少我猜这是事件Bubbling。我的网站由相互叠加的图像和区域贴图组成，以便具有可点击和可收起的区域 - 而不是整个图像应该是hovertarget。

当您将鼠标悬停在某些区域地图上时，该网站会将图片的src更改为另一个。我通过一个函数管理它，没问题。我的html中有这个：

<map>
<area shape="rect" coords="870,0, 1040,110" alt="story2" 
  onmouseenter="glow5SecStop(); overlay1FadeOut();  changeImage('overlay1','images/00/00-story2.png'); overlay1FadeIn();" 
  onmouseleave="changeImage('overlay1','images/00/overlay-leer.png'); glowsAn();" style="cursor:help;"/>
</map>

OnMouseEnter在：
function1停止setTimeout，

function glow5SecStop() {
if (glow5secAn==1) {
    clearTimeout(glowCheck3);
    clearTimeout(glowCheck4);
    glowCheck3 = null;
    glowCheck4 = null;
    $("#glowsImg").fadeTo(0,0);
    }
}

function2在0秒内将图像淡出为0

function changeImage(target,image)  {
        sourceImage.src = image;            
        document.getElementById(target).src = sourceImage.src;
    }

function3更改图像源

sourceImage = new Image();

function changeImage(target,image)  {
        sourceImage.src = image;            
        document.getElementById(target).src = sourceImage.src;
    }

function4淡化了

中的最后一张图像

function overlay1FadeIn() {
        $("#overlay1").fadeIn(300);
        document.getElementById("glowsImg").style.visibility = "hidden";
    }

OnMouseLeave在
function1将imagesource更改回完整的透明图像。它与Onmousenter相同。
function2激活发光

function glowsAn() {
    document.getElementById("glowsImg").style.visibility = "visible";
    }

这一切都很好，但如果我快速盘旋在该区域上它将无法完成并堆叠起来，当我将鼠标悬停在该区域上时，它会像我在它上面盘旋一样频繁地播放。

我已经看到了其他论坛中事件发生问题的一些解决方案，这里将onmouseover更改为onmousenter，但这并没有解决这个问题。
我几乎是编程的菜鸟，我正在寻找这个问题的具体解决方案
西蒙

JS - Onmouseenter'事件冒泡'

0 个答案: