Come per le targhette o immagini possiamo applicare l'effetto rollover anche sul logo del nostro forum. Per far questo possiamo usufruire della proprietą mouseover e mouseout oppure direttamente da colori e stili e HTML.
Tramite le proprietą potremo fare cosi:
CODICE
<img src="LINK LOGO INIZIALE" onmouseover="this.src='LINK LOGO CON MOUSE SOPRA'" onmouseout="this.src='LINK LOGO FINALE, METTERE L' INZIALE SE E' LO STESSO'">
Per un codice completo useremo questo:
In codici HTML in alto nel forum inseriremo questo:
CODICE
<a href="Link del forum" class="rollover"></a>
mentre in colori e stili questo:
CODICE
.rollover {display: block;
width: 300px;
height: 114px;
background: url(http://url) top}
.rollover:hover {width: 300px;
height: 114px;
background: url(http://url) top}
Si deve adattare il witdh e height alla grandezza del logo.
Altro metodo č questo:
in codici html in alto nel forum inseriremo questo:
CODICE
<div id="logo" class="logo"><a href="Link" id="logo1"></a></div>
e in colori e stili:
CODICE
.logo a:link, .logo a:visited {display: block; float: center}
#logo1 {background: url(URL) top center; height: altezzapx; width: grandezzapx}
a:hover#logo1 {background-position: bottom center}
In questo caso il logo che faremo andrą inserito in #logo1 {background: url(URL)...... e sarą la parte statica in alto e la parte "al passaggio del mouse" in basso e devono essere perfettamente a metą. L'altezza che devi impostare nel css deve essere la metą di quella dell'immagine.
