0

エリア マップで Lightbox を使用しようとしています。Firefox では問題なく動作するようになりましたが、Internet Explorer では新しいウィンドウが開くだけです。Slimbox を使ってみたのですが、エリアマップには全く対応していないようです。

提案？HTMLコードは次のとおりです。

<div align="center"><img src="images/background-temporary.jpg" width="667" height="475" border="0" usemap="#Map" />
<map name="Map" id="Map">
  <area href="images/background-temporary.jpg" shape="poly" coords="236,396,267,396,269,428,237,429,236,396"  />

</map>

4

2 に答える 2

1

ああすごい。「rel="lightbox"」属性を失ったのはいつですか。失敗した。

于 2009-08-13T16:07:32.940 に答える
1

これは IE だけでなく、どのブラウザでも動作するはずです。エリア マップで、id タグを追加します。

    <area shape="rect" id="yourid"  coords="5,65,132,116" alt="Your Alt Description" />

マップの外側で、タグ内に ID を持つ空のスパンを使用して、この種のコードを html に追加します。

    <a href="an_image.jpg" rel="lightbox[a]" Title="My title"><span id="empty_span"></span></a>

JavaScriptを使用して、次のようにします

    <script>
    $('area').click(function(){
         $("#empty_span").click();
    });
    </script>

複数の領域の場合、次のように、複数のクリック関数を作成するか、領域タグとクリック関数の両方で ID に番号を付けることができます。

    <map etc....
    <area shape="rect" id="id1" coords="5,65,132,116"   alt="1st Description" />
    <area shape="rect" id="id2" coords="55,65,132,116"  alt="2nd Description" />
    <area shape="rect" id="id3" coords="105,65,132,116" alt="3rd Description" />
    </map>

    <a href="1st_image.jpg" rel="lightbox[a]" Title="1st title"><span id="span1"></span></a>
    <a href="2nd_image.jpg" rel="lightbox[a]" Title="2nd title"><span id="span2"></span></a>
    <a href="3rd_image.jpg" rel="lightbox[a]" Title="3rd title"><span id="span3"></span></a>

    <script>
    $('area').click(function(){
          $("#span"+$(this).attr("id").substr(2)).click();
    });
    </script>
于 2012-12-16T17:35:56.740 に答える