2017-01-19 7 views
0

私はイメージマップ配置で小さな画像を持っています。エリアをクリックするたびに、test1、test2、またはtest3エリアをクリックしても、test2エリアの不透明度を変更する必要があります。 jqueryの構文がわからないので、これを解決する方法を教えていただけたらと思います。ありがとうございました。image.map領域の不透明度を変更します

<img src="testing.png" usemap"testing-map" /> 

<map name="testing-map"> 

    <area shape="rect" coords="426,274,456,300" alt="test1" /> 
    <area shape="rect" coords="456,274,618,300" alt="test2" /> 
    <area shape="rect" coords="618,274,678,300" alt="test3" /> 

</map> 

のjQuery:

$('area').on('click', function() { 
--- no idea --- .css('opacity', '0.1'); 
}); 
+0

私はそこにJqueryプラグインがあると思う - https://github.com/jamietre/ImageMapster –

+0

可能な重複 - http://stackoverflow.com/questions/8343531/is-it-possible-to-style-a -mouseover-on-an-image-map-using-css –

答えて

0
$('map area').on('click', function() { 
    $('area[alt="test2"]').css('opacity', '0.1'); 
}); 

または

$('map area').on('click', function() { 
    $('area[alt="test2"]').attr('css', 'opacity:0.1'); 
}); 
+0

ありがとうございますが何らかの理由で何もしません –

+0

これはあなたにとって役に立ちます:http://stackoverflow.com/questions/3887953/how-to-地図上の不透明度を – mariobros

0

を使用してみてください

$('area[alt=test2]').css({'opacity':'0.1'}); 
+0

ありがとうございますが何らかの理由で何もしません –

0
Try this: 

    $('area').on('click', function() { 
     $("area[alt=test2]").css('opacity', '0.1'); 
    }); 

これは、「alt」属性テキスト値が「test2」に等しいすべての要素の不透明度を変更します。

+0

ありがとうございますが何らかの理由で何もしません –

関連する問題