Два ONMOUSEOVER на одном источнике. Javascript

Question

Я пытаюсь написать JavaScript с баннером. Когда я курю над баннером, он меняется на другой баннер. Затем, когда я выхожу, он должен оставаться таким же. Затем, когда я вернусь назад, он должен вернуться к оригинальному баннеру. Однако я не могу понять, как это сделать. Любой совет?;

Answer 1

использование Javascript

<img onmouseover="changeImage()" id="myBanner" src="Images\image1.jpg"/> 
<script> 
function changeImage(){ 
    if(document.getElementById("myBanner").src=="Images\image1.jpg"){ 
    document.getElementById("myBanner").src="Images\image2.jpg" 
    }else{ 
    document.getElementById("myBanner").src="Images\image1.jpg" 
    } 
} 
</script> 

Это работает для 2-х изображений, переключаясь между друг другом. Если вы хотите использовать больше, я предлагаю использовать переменную, которую вы передаете функции, и switch, которая проходит через все ваши параметры.

Answer 2

Вам нужен только один MouseOver обрабатывать тумблер:

(function() { 
    var imgTag = document.getElementsByTagName('img')[0]; 
    imgTag.addEventListener('mouseover', function(e) { 
     var currentImage = imgTag.getAttribute('src'); 

     imgTag.setAttribute('src', imgTag.getAttribute('data-other-image')); 
     imgTag.setAttribute('data-other-image', currentImage); 
    }); 
}()); 

Демо: http://jsfiddle.net/EsNEC/

Таким образом, у вас нет встроенного JavaScript в вашем HTML.