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 플러그인에 메소드가 있습니까?
. 고맙습니다! –