0

パラメータとして「onmouseover」がある場合、何らかの理由でこの画像をクリックしてファンシーボックスを表示できません。

<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」を削除すると、正常に動作します。これを「修正」するにはどうすればよいですか？

ジェームズ

4

1 に答える 1

0

まず、この行：

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

...実際には何もしません。この時点でelementはまだセレクターを定義するための適切な記号 (#または.) が必要なので、この場合は次のようにする必要があります。

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

第二に、画像を使用する画像の上に別の画像をオーバーレイしている場合、このJSFIDDLEmapのようにしていると思いますが、

...その後、「下の画像をクリックできるように、オーバーレイがクリックに応答しないようにする」ためにできることは何もありません。

ただし、オーバーレイ画像を下の画像と同じ画像を使用する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 を使用します。

更新された JSFIDDLEを参照してください

于 2013-04-11T18:11:58.683 に答える