Как изменить изображение кнопки при нажатии?

Question

Я использую изображения и hrefs для создания кнопок. Код выглядит так:

<a href="http://www.zive.sk"><img src="res/images/zive.png" alt="Zive.sk" id="ziveCircle"></a> 

Есть ли способ изменить изображение src, если пользователь нажмет кнопку? Может быть, какой-то обработчик событий, который определит, что пользователь нажал изображение? Он должен действовать как обычная кнопка, поэтому, когда пользователь нажимает на нее и удерживает ее, она должна менять изображение src, а когда он отпускает кнопку, тогда загружается href (нормальное поведение кнопки).

PS: Я не могу использовать css для этого.

Answer 1

Я нашел решение, используя некоторые надежды я помог сценарий. Вот код:

function buttons(){ 
document.getElementById('zive-anchor').onmousedown=function() { 
    document.getElementById('ziveCircle').src = 
    "res/images/zivePressed.png"; 
}; 
document.getElementById('zive-anchor').onmouseout=function() { 
    document.getElementById('ziveCircle').src = 
    "res/images/zive.png"; 
}; 
}; 

и вот HTML:

<div data-role="page" id="homepage"> 
     <div id="selectCircle"> 
      <a href="feeds.html#page1" rel="external" id="zive-anchor"><img src="res/images/zive.png" alt="Zive.sk" id="ziveCircle"></a> 

Answer 2

Это изменит изображение кнопки на вашем StackOverflow Gravatar значок (изменить URL соответственно):

HTML:

<a id="zive-anchor" href="javascript:void(0);"> 
    <img id="zive-img" src="res/images/zive.png" alt="Zive.sk" id="ziveCircle"> 
</a>​ 

Javascript:

document.getElementById('zive-anchor').onclick=function() { 
    document.getElementById('zive-img').src = 
    "http://www.gravatar.com/avatar/ca2a5b453d7e221f50929cbf6d688e59?s=32&d=identicon&r=PG"; 
};​ 

JSFiddle:

http://jsfiddle.net/CsCSC/

Answer 3

function play() 
{ 



var player= document.getElementById("audio"); 


if(player.paused) 

player.play(); 


else 
player.pause(); 

change(); 

} 

function change() 
{ 

var imag = document.getElementById("play") 

if(imag.src.match('Play')) 
imag.src="pause.jpg"; 

else 
imag.src="Play.jpg"; 



}