Creare un pulsante grafico rollover

Autore: Fabio Di Matteo
Ultima revisione: 16/05/2009

Per pulsanti rollover si intendono pulsanti realizzati mediante immaginette. Per l'esattezza 3 immaginette una per lo stato normale del pulsante, una per l'evidenziazione e l' ultima per quando si clicca sul pulsante.

Ecco un esempio:

<a href="https://www.freemedialab.org/wiki">
<img src="btn-normale.png" border="0" alt="e dai clicca!"   onMouseOver="this.src='btn-evidenziato.png'" 
  onMouseOut="this.src='btn-normale.png'" Onclick="this.src='btn-cliccato.png'" >
</a>

dove :

• onMouseOver=“this.src='btn-evidenziato.png'“ specifica l'immagine quando si passa con il mouse sopra il pulsante ;
  
• onMouseOut=“this.src='btn-normale.png'” specifica l'immagine quando il mouse va fuori il pulsante ;
  
• Onclick=“this.src='btn-cliccato.png'” specifica l'immagine quando si clicca sul pulsante ;
  

Ecco le tre immagini usate (realizzate automaticamente con Gimp):