Question

出于某种原因，如果我将“onmouseover”作为参数，我无法点击此图片来显示fancybox：

<area onmouseover="toggleOverlay('SteWoz',1);" id="locSteWoz" alt="Test" class="fancybox" coords="24,51,236,244" href="http://www.google.com" rel="iframe" shape="rect" title="Test">

编辑：这就是toggleOverlay的作用：

<script>
    function toggleOverlay(name, newState){
        var element = 'imgOverlay' + name;
        var newDisplay

        if (newState == 0) {newDisplay = 'none'}
        if (newState == 1) {newDisplay = 'block'}           

        document.getElementById(element).style.display = newDisplay;
        //document.getElementById(element).style.z-index = '5';

            $(element).hide().fadeIn(4000);
    }
</script>

如果我删除“onmouseover”它可以正常工作。我怎样才能“修复”这个？

詹姆斯

Answer 1

首先，这一行：

$(element).hide().fadeIn(4000);

...实际上没有做任何事情，因为此时element仍然需要一个正确的符号（#或.）来定义选择器，所以在这种情况下应该是：

$("#" + element).hide().fadeIn(1000);

第二次，如果您在使用图片map的图片上覆盖另一张图片，我认为您在此 JSFIDDLE ，

...然后您无法做任何事情“ 使叠加层不响应任何点击，以便可以点击下面的图片 ”。

然而，你可以做的是让叠加图像使用与下图相同的图像map，这样，在你的toggleOverlay()功能中，你可以调整这一行

$("#" + element).hide().fadeIn(1000);

...进入这个

$("#" + element).hide().fadeIn(1000).attr("usemap", "#Map");

...假设你的html看起来像

<map name="Map" id="Map"> <area onmouseover="toggleOverlay('SteWoz',1);" id="locSteWoz" class="fancybox" shape="square" coords="0,0,415,319" href="{target}" title="title" alt="alt" /> </map>

...否则请使用map标记的相应ID。

参见 updated JSFIDDLE

点击图片不起作用

1 个答案: