Разобрался. Ноипоявилась другая проблема. Теперь код выглядит так
<head>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="maphilight.js"></script>
<script>
$(function() {
$('.map').maphilight();
$('#star').click(function(e) {
e.preventDefault();
var data = $('#star').data('maphilight') || {};
data.fillOpacity = 0.4
$('#star').data('maphilight', data).trigger('alwaysOn.maphilight');
});
});
</script>
</head>
<body>
<img src="img.gif" width="300" height="300" class="map" usemap="#features">
<map name="features">
<area shape="poly" id="star" alt="" onfocus="this.blur();" class="{alwaysOn:true,stroke:false,fillColor:'ffc000',fillOpacity:0.1}" coords="58,117,49,141,48,153,61,159,67,151,68,142,66,128,61,132,61,124,65,119" href="#" onclick="result();" >
<area shape="poly" id="star2" alt="" onfocus="this.blur();" class="{alwaysOn:true,stroke:false,fillColor:'ffc000',fillOpacity:0.1}" coords="1,1,44,44,55,55,66,66,11,11" href="#" onclick="result();" >
</map>
</body>
Так работает для 1го элемента. Для второго можно продублировать функцию, но опять же примитивно.
если сделать вот так
var='star';
$(function() {
$('.map').maphilight();
$('#''+ a +').click(function(e) {
e.preventDefault();
var data = $('#'+ a +'').data('maphilight') || {};
data.fillOpacity = 0.4
$('#'+ a +'').data('maphilight', data).trigger('alwaysOn.maphilight');
});
});
<area shape="poly" id="star2" onmouseover='a="star2";' alt="" onfocus="this.blur();" class="{alwaysOn:true,stroke:false,fillColor:'ffc000',fillOpacity:0.1}" coords="1,1,44,44,55,55,66,66,11,11" href="#" onclick="result();" >
Но так ничего не происходит, похоже на то что один раз функция проинициализировалась с исходной переменной а, и при замене переменной, это действие никакого влияение на функцию не оказывает. Тут крутятся мысли что каким-то образом надо вызвать ту функция и вместо $('#'+ a +'') поставить $(this)... Но как реализовать вызов функции не знаю, и будет ли так работать? Гуру яваскрипта помогите пжл