JS 크로스 브라우저 호환성 문제

-1

이 코드는 Chrome에서 제대로 작동하지만 Firefox 또는 IE에서는 제대로 작동하지 않습니다. 파이어 폭스에서 그것을 시도하는 경우 http://jsfiddle.net/ve9hywdq/1/가 원하는 맵의 부분을 클릭 할 수 없습니다하지만 크롬에서 당신은 할 수 있습니다 여기에 JS 크로스 브라우저 호환성 문제

<script> 
$(document).ready(function(){ 
    var currentOne=$("#instructions"); 
    currentOne.addClass("visibleLabel"); 

    $('map area').mousemove(function(e) { 
     $(currentOne).removeClass("visibleLabel"); 
     currentOne = '#' + $(this).data('label'); 
     $(currentOne).addClass("visibleLabel"); 
    }); 

}); 
</script> 

<img src="http://greenparty.org.uk/assets/images/site_graphics/national/greenmap.png" 
    usemap="greenuk" id="theGreenMap"> 

<map name="greenuk"> 
    <area shape="poly" id="region-southeast" 
      data-label="southeast" coords="256,485,262,486,285,542,301,531,344,536,349,547,298,577,263,574,234,587,205,577,202,562,216,513,214,499,247,498" 
      alt="southEast" href="south-east" /> 
    <!-- etc. --> 
</map>

은 JS 바이올린입니다.

출처

2014-10-23 Moe Tarhini

테스트하는 방법은 어떻습니까? – Shaeldon

어떤 부분이 작동하지 않습니까? – scunliffe

우리에게 바이올린을 줘! – patrickdamery

귀하의 문제는 귀하의 스크립트와 관련이 없으며 (완전히 삭제할 수 있고 문제가 지속될 수 있음) 귀하의 HTML과 관련된 모든 사항이 있습니다.

usemap 속성의 앞에는 #이 있어야합니다. W3C spec on <map> 따르면

usemap 속성은 지정된 경우 map 소자 유효한 해시 이름 참조이어야한다. hash-name reference

는

정확하게 요소의 name 속성의 값과 일치하는 문자열 하였다 (0,023 U +) 문자 "#"로 이루어진 문자열

usemap 값에 #이라는 선도가 없으므로 Chrome은이 사양의 요구 사항을 수용하며 Firefox는 허용하지 않습니다. #을 usemap 속성에 추가하면 코드가 수정됩니다.

출처

2014-10-23 14:26:39 apsillers

JS 크로스 브라우저 호환성 문제

답변

관련 문제