1

スクリプトに 2 つの異なるエリア タグを 1 つとして解釈させるにはどうすればよいですか?

たとえば、ここに筋肉マップがあります

フィドル

<img src="http://www.ise-dvp.narod.ru/atletics/images/man2.gif" class="atlas" alt="muscles" usemap="#Navigation">

        <map id="Navigation" name="Navigation">

  <area shape="poly" coords="88,265,74,266,65,257,57,226,64,199,75,182,87,181,102,198,106,214,100,240,97,251,86,261,80,263,85,262" href="#"  alt="muscle1">
  <area shape="poly" coords="123,269,108,237,108,208,114,196,126,183,139,181,145,194,152,218,154,233,152,254,146,272,139,279,120,275,121,267" href="#"  alt="muscle2">

        </map>

$(document).ready(function ()
        {
            $('.atlas').maphilight();
        });

maphilight.js を使用して、マウスオーバーで領域を選択します。太ももの筋肉 (両脚) を選択する必要がありますが、選択されるのは 1 つだけです。他の筋肉にも同じ問題があります。マウスオーバーで両方を同時に選択したい。

2つのエリアタグを結合したり、maphilight.jsで2つのタグを1つに選択させることはできますか?

助けてください=）

4

1 に答える 1

1

エリアタグにいくつかの属性を追加し、それをデフォルトの関数オプションに追加する必要があります。次に例を示します。

<area shape="poly" coords="88,265,74,266,65,257,57,226,64,199,75,182,87,181,102,198,106,214,100,240,97,251,86,261,80,263,85,262" href="#"  alt="muscle1" group="thigh">
<area shape="poly" coords="123,269,108,237,108,208,114,196,126,183,139,181,145,194,152,218,154,233,152,254,146,272,139,279,120,275,121,267" href="#"  alt="muscle2" group="thigh">

JS：

$.fn.maphilight.defaults = {
    ...
    groupBy: 'group',
    ....

属性group="thigh"は同じであるため、ホバーすると両方ともハイライトされます。

フィドルを見る

于 2013-01-17T23:49:02.813 に答える