Imageflip Javascript не сбрасывает

У меня есть этот код 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: 'onMouseOver' в HTML должен быть все строчным:' onmouseover' – myfunkyside

@myfunkyside Приятно знать, но это не помогло ... – Maccaroni

Должно ли это выглядеть так? http://jsfiddle.net/matthias_h/wfyw63c4/ –

Есть некоторые ошибки в вашем HTML, а также в вашем JavaScript:

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

Название нового изображения должны быть такими же, например,

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

Использование чистого javascript, изменение источника изображения в ваших функциях не будет работать так, как вы, например. здесь:

document.juego_paramo.src=original;

Это должно быть

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

(при условии, что исходное изображение имеет идентификатор = "juego_paramo", который я просто добавил для удобства).

Вашего <area> заканчивается с атрибутами alt="helecho", onMouseOver="resaltarHelecho", onMouseOut="originalJuego" - это должно быть alt="helecho" onMouseOver="resaltarHelecho()" onMouseOut="originalJuego()" - нет «» между атрибутами, и отрегулировал вызов для функций для мыши-событий.

Сообщение console.log удалено в обновленном Fiddle - это было просто, чтобы убедиться, что функция была вызвана до того, как я добавил фиктивные изображения.

источник

2014-10-03 19:02:42

удивительный, спасибо. Хорошо объяснил. Я только начал изучать JS и ублажать любые подсказки и подсказки. Я бы поднял ваш ответ, но не могу. Большое спасибо Матиасу. – Maccaroni

Imageflip Javascript не сбрасывает

ответ

Смежные вопросы