jQuery를은 "onclick을"나는 maphilight 플러그인을 사용하고 방법

Question

, 그것은

(: http://davidlynch.org/projects/maphilight/docs/ 문서 여기) 마우스 오버에 자신의지도에 정의 된 영역에 '의 usemap'속성을 이미지에 적용하고 설명하여 maphilight.

"onmouseover"대신 onClick 이벤트를 사용하여 hilight 효과를 트리거합니다.

jQuery('.area').click(function(e){ 
    e.preventDefault(); 

    var data = jQuery(this).mouseout().data('maphilight') || {}; 
    data.alwaysOn = !data.alwaysOn; 
    jQuery(this).data('maphilight', data).trigger('alwaysOn.maphilight'); 

}); 

제대로 작동하지만 난 새로운 클릭을 할 때 hilight 효과를 지우려면 :

나는이 작업을 수행.

아이디어가 있으십니까?

Answer 1

봐 : 여기에

  $(map).trigger('alwaysOn.maphilight').find('area[coords]') 
      .bind('mouseover.maphilight', mouseover) 
      .bind('mouseout.maphilight', function(e) { clear_canvas(canvas); }); 

: 트릭을 할 것 "클릭"하기 위해 "마우스 오버"이벤트를 변경

  $(map).trigger('alwaysOn.maphilight').find('area[coords]') 
      .bind('click.maphilight', mouseover) 
      .bind('mouseout.maphilight', function(e) { clear_canvas(canvas); }); 

.

Answer 2

코드를 살펴보면, 캔버스를 지우는 하이라이트 맵에 이벤트 mouseout.maphilight이 바인딩되어있는 것처럼 보입니다. 나는 당신이 그것을 지우기 위해 그 사건을 일으킬 수 있다고 생각할 것입니다. 아마 상태를 추적해야 할 것 같습니다. 코드와 변화의이 부분에 대한

Answer 3

<code> 
$('.mianchor').click(function(e) { 
     e.preventDefault(); 
     var colorx = $(this).attr('title'); 
     var data = {}; 
     data.alwaysOn = !data.alwaysOn; 
     data.stroke = 'none'; 
     data.strokeWidth = 0.0000001; 
     data.strokeColor = colorx; 
     data.fillColor = colorx; // Sample color 
     data.fillOpacity = 1; 
     $('#mapa').data('maphilight', data).trigger('alwaysOn.maphilight');   
    });