05 20th, 2009| 
All’articolo precedente abbiamo creato un banner estensibile usando JS e CSS, e associando il tutto ad un DIV.
Però si può fare di meglio, sfruttando la proprietà CSS del tag <A>: hover!
Impostando il nostro <A> di altezza fissa, con overflow:hidden, possiamo dirgli di ingrandirlo in rollover!
Ecco il codicello:
<style type="text/css">
a.banner{
height: 120px;
overflow: hidden;
border:3px solid #ff6600;
margin: 0 0 10px 0;
/* firefox va solo con display:block… */
display:block;
float:left;
}
a.banner:hover{
height: auto;
}
</style>
<a class="banner" href="http://www.google.com"><img src="http://i43.tinypic.com/358ulqh.jpg" border="0" /></a>
Ed ecco l’esempietto:
Ciao amici!
Hai trovato questo post interessante? Sei un utente twitter? Condividilo allora con i tuoi amici con un simpatico cinguettio semplicemente cliccando il tasto twittami. Grazie.
Anche su FriendFeed si è discusso di questo articolo. Vediamo come. 
October 4th, 2007 at 14:00
Sei il solito porcellone! Fai il bravo che tra meno di 48 ore sarai un marito!
October 4th, 2007 at 14:14
Io studio CSS per voi e voi mi date del porcellone… boh!
October 13th, 2007 at 15:53
Bello! Lo userò!
October 15th, 2007 at 00:28
Ottima mossa! E il livello che la contiene deve avere anch’esso una height:auto, giusto?
March 6th, 2008 at 19:25
[...] Banner ingrandibili al passaggio del mouse grazie ai css [...]
March 5th, 2009 at 09:20
[...] l’anno 2007 quando vi proponevo un sistema in CSS per creare banner espandibili. 4 marzo 2009, con la cautela di sempre, adsense propone i banner espandibili: "expandable [...]
April 28th, 2009 at 10:14
[...] però vi può interessare un altro post sul rollover o sul [...]
May 20th, 2009 at 21:04
Uhm…credo sia errato il link all’immagine perchè io nella tua pagina non vedo nulla, solo una striscia arancione
May 20th, 2009 at 21:24
@liliansi: evidentemente i simpaticono di image shack hanno deciso che non avevano voglia di ostare l’immagine. Provveduto subito con una sorpresa. Grazie per la segnalazione.
May 20th, 2009 at 21:30
eh a volte capita. io carico le foto sempre sul mio spazio via FTP perchè non mi fido per niente di imageshake. bel trucchetto con i CSS comunque, soluzione interessante! bella anche la foto
ciao!
May 20th, 2009 at 21:32
Infatti spesso uso tinypic mi da molta affidabilità. Tempo fa usavo flickr, ma è una me**a e mi ha chiuso anche un account a pagamento senza motivo alcuno. Ora uso picasa web per quelle importanti, tinypic per quelle al volo, imgshack per quelle via url… ma come vedi non sempre vale la pena!