Come aggiornare un'immagine su rollover

December 16

Durante lo sviluppo di un sito web, è possibile implementare rollover di immagini per migliorare l'aspetto del tuo sito web. Con un rollover di immagini, è possibile visualizzare due immagini separate a seconda della posizione del mouse. Se si sposta il mouse sopra l'immagine, l'immagine si aggiorna alla vostra immagine 'rollover'. Quando si sposta il mouse fuori del rollover, sarà ripristinare l'immagine originale.

istruzione

1 Fare clic su "Start", tipo "Blocco note" nel campo di ricerca rapida e premere "Invio".

2 Premere "Ctrl" e "O" allo stesso tempo. Individuare la pagina Web sul computer che si sta lavorando e aprirlo. Sfoglia il codice fino a trovare l'immagine per cui si desidera un rollover.

3 Digitare il seguente codice prima del tag immagine:

<a href="link.html" onmouseover="document.sub_but.src='rollover.jpg'" onmouseout="document.sub_but.src='original.jpg'">

4 Tipo "</a>" (senza virgolette) a seguito del tag di immagine. Questo sarà quindi inserire un rollover.

5 Aggiungere al "<img>" tag i seguenti parametri:

name = "sub_but"

Consigli e avvertenze

  • Negli esempi utilizzati l'immagine di rollover si chiama 'rollover.jpg' e l'immagine originale dal titolo 'original.jpg'. Sostituire il testo con il percorso e il nome delle immagini desiderate.
  • Se non si desidera che il pulsante che vi porterà a una nuova posizione quando si fa clic su di esso, aggiungere il seguente codice al tag "<a>":
  • onclick = "return false;"