Imageflip Javascript가 뒤집히지 않습니다

나는이 자바 스크립트 코드가 있습니다. 마우스 오버시 이미지 플립을 완성하고 싶은 사진이 있습니다. 브라우저에 표시하면 원본 이미지가 나타납니다. 정의 된 영역 위로 마우스를 가져 가면 커서가 손 모양으로 바뀌지 만 이미지는 넘겨지지 않습니다. 따라서 정의 된 영역 (좌표가 다각형으로 작성된 영역)을 인식하지만 뒤집습니다.Imageflip Javascript가 뒤집히지 않습니다

<html> 
<head> 
</head> 
<body> 

<img name="juego_paramo" src=paramo_plantas_original.gif usemap="#paramo"> 


<map name="paramo"> 
<area shape="poly" coords="0,161,4,161,4,162,12,162,12,163,19,163,26,165,34,166,45,168,52,170,62,174,73,177,82,180,91,184,103,188,112,192,122,196,133,202,142,207,152,212,162,216,172,221,180,224,186,227,193,230,197,233,0,233,0,161" 
href="#" alt="helecho", onMouseOver="resaltarHelecho", onMouseOut="originalJuego"> 
<area shape="default" nohref> 
</map> 


<script> 

//preload the images 
original = new Image(698,233) 
originale.src = "paramo_plantas_original.gif" 

helechoResaltado = new Image(698,233) 
helecho.src ="paramo_plantas_con_mouse_blanco.gif" 

//JS function to enlarge the image 
function resaltarHelecho() { 
          document.juego_paramo.src=helechoResaltado; 
            return true; 
            } 

function originalJuego() { 
            document.juego_paramo.src=original; 
            return true; 
            } 

</script> 
</body> 
</html>

나는 실수를 찾을 수 없습니다. 힌트는 어디에서 찾을 수 있습니까?

출처

2014-10-03 Maccaroni

sidenote : HTML의 onMouseOver는 모두 소문자 여야합니다. : onmouseover – myfunkyside

@myfunkyside 잘 알고 있습니다 만, 그 속임수를 쓰지 않았습니다 ... – Maccaroni

어떻게 든 그렇게 보일까요? http://jsfiddle.net/matthias_h/wfyw63c4/ –

는 자바 스크립트뿐만 아니라 당신의 HTML에서 몇 가지 실수가 있습니다

original = new Image(698,233) 
originale.src = "paramo_plantas_original.gif"

새로운 이미지의 이름은 같은, 예를 들어,해야

originale = new Image(698,233) 
originale.src = "paramo_plantas_original.gif"

순수 자바 스크립트를 사용하면 함수에서 이미지의 소스를 변경하면 예를 들어 여기서는

document.juego_paramo.src=original;

이

document.getElementById('juego_paramo').src = originale.src;

가 (원래 이미지에 ID = "juego_paramo"I은 단지 편의를 위해 첨가하는 제공을 갖는다) 일 것이다. 속성 사이에 ","아니,와 마우스 이벤트에 대한 함수 호출을 조정 -이 alt="helecho" onMouseOver="resaltarHelecho()" onMouseOut="originalJuego()"해야한다 - 당신의 <area>

는 속성 alt="helecho", onMouseOver="resaltarHelecho", onMouseOut="originalJuego"로 끝납니다.

console.log 메시지가 업데이트 된 Fiddle에서 삭제되었습니다. 더미 이미지를 추가하기 전에 console.log 메시지가 삭제되었습니다.

출처

2014-10-03 19:02:42

끝내 주셔서 감사합니다. 설명해. 방금 JS를 배우기 시작했고 힌트와 힌트를 확인했습니다. 나는 너의 대답을 업보 회피 할 것이지만 나는 할 수 없다. 고마워. 마티아스. – Maccaroni

Imageflip Javascript가 뒤집히지 않습니다

답변

관련 문제