0

画像マップがあり、次のポリゴンがクリックされるまでポリゴンが強調表示されるようにしたいと思います。

のように：plogone1をクリックします-強調表示されます

より：ポリゴン2をクリックします-ハイライトされます（ポリゴン1はハイライトされません）

<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="jquery.maphilight.js"></script>
<script>
$(function() {
 var nr = 0;
$('.map').maphilight({ strokeColor: 'ff0000', strokeWidth: 5});
$(polymap).click(function(e) {
            var data = $(high1).mouseout().data('maphilight') || {};
            data.alwaysOn = !data.alwaysOn;
            $(high1).data('maphilight', data).trigger('alwaysOn.maphilight');
            });
  });


</head>
  <body>
    <br>
    <img class="map" src="pb90%20%28150%29.html.png" ismap="ismap" usemap="#mapmap" alt="html imagemap created with QGIS" border="0">
    <map id="polymap" name="mapmap">
      <area id='high1'  shape="poly" href="PDF1.pdf" target="cont" coords="834,366,837,363,840" alt="">
      <area id='high2'  shape="poly" href="PDF2.pdf" target="cont" coords="940,236,941,236" alt="">
      <area id='high3'  shape="poly" href="PDF3.pdf" target="cont" coords="831,345,828,348,824" alt="">
....

私の問題は、エリアのIDにアクセスできないことです。ポリゴンをクリックすると、「high1」のある領域のみがハイライト表示されます。だからその代わりに

$(high1).

一種のイベントハンドラーが必要です。

誰かが解決策を知っていればそれは本当にクールでしょう:-)

イマニュエルを応援します

4

1 に答える 1

0

jqueryセレクターをオンareaにすると、クリックイベントで実行される関数は、クリックした領域によって異なります。関数内で、thisキーワードを使用して呼び出し元オブジェクトを参照できます。

   $('area').click(function (e) {
        var data = $(this).mouseout().data('maphilight') || {};
        data.alwaysOn = !data.alwaysOn;
        $(this).data('maphilight', data).trigger('alwaysOn.maphilight');
    });
于 2013-03-12T02:22:00.397 に答える