... così:

codice:
<style type="text/css">

.c1 {
background-image:url('immagine1.gif');
}

.c2 {
background-image:url('immagine2.gif');
}

</style>
E poi abbiamo l'immagine:

codice:
<div class="c1" style="width:300;height:200;" onClick="this.className='c2';" onMouseUp="this.className='c1';"></div>
Dove 300 e 200 sono, rispettivamente, larghezza e altezza della tua immagine iniziale.

Fammi sapere !