2011-08-23 2 views
0

jQuery Maphilight 플러그인 (this Maphilight demo 참조)을 사용하는 미국지도가 있습니다. 내 코드는 다음과 같습니다 : 나는 jQuery를 qTip 플러그인과를 결합했다jQuery/JavaScript의 두 바인딩 된 mouseOver 이벤트 중 하나만 조건부로 실행합니다.

$('.map').maphilight(); 

. 사용자가지도상의 각 <area> 위에 마우스를 놓을 때 표시되도록 q 팁 도구 팁을 설정했습니다. 내 코드는 다음과 같습니다

$('area').each(function() { 
    $(this).qtip({ 
     content: $(this).attr('data'), 
    }); 
}); 

그래서 '강조'하고 '도구 팁'모두 발생하는 각 <area>을 통해 사용자 이동합니다.

전설도 있습니다. 위의 Maphilight 데모를 사용하면 전설에 분홍색, 자주색, 녹색 및 노란색이 표시됩니다. 예를 들어 노란색 범례 키 위로 이동하여 모든 노란색 필드를 강조하고 싶습니다.

이렇게하려면 각 상태 <area>에서 class 속성을 실제 색상으로 설정합니다. 각 범례에서 색상 <area>class="color"myColor을 실제 색상과 동일하게 설정했습니다. 나는 Maphilight documentation에 따라, 각 <area>에서 mouseOver을 시뮬레이션하여 다음 JavaScript를 가지고 강조 표시를 활성화합니다. 그러나

<area class="color" myColor="yellow"> 
$('.color').mouseover(function() { 
    $('.' + $(this).attr('myColor')).mouseover(); 
}); 

$('.color').mouseout(function(e) { 
    $('.' + $(this).attr(myColor)).mouseout(); 
}); 

, 당신이 상상할 수있는, 이 또한 색상의 모든 단일 국가에 대한 도구 설명을 제공합니다. 두 개의 바인딩 된 경우 하나의 mouseOver 이벤트 만 활성화하려면 어떻게해야합니까?

이것은이 특정 scenerio의 범위를 벗어나는 일반적인 jQuery 문제 여야합니다. 그러나 검색 방법은 확실하지 않습니다. 일반적으로 특정 선택 항목 (예 : $('area#some_id'))에 대한 효과를 시뮬레이션 할 수있는 각 jQuery 플러그인에 메소드가 있습니까?

답변

1

maphilight는 이벤트를 이름 짓는 것처럼 보입니다. 그래서, 당신은이 작업을 수행 할 수 있어야한다 :

$('.' + $(this).attr(myColor)).trigger("mouseover.maphilight"); 

편집 : 네임 스페이스 이벤트에 대한 정보를 들면 : 내가 찾던 정확히이었다 http://docs.jquery.com/Namespaced_Events

+0

. 고맙습니다! –

관련 문제