[CSS] RollOver Images

Andare in basso

[CSS] RollOver Images

Messaggio Da WebMyl il Lun 5 Nov 2007 - 13:48

Ecco un metodo appena scoperto da WebMyl per creare il cosidetto effetto "rollover images" (al passaggio del mouse su un'immagine si riesce a cambiare immagine) utilizzando i css e non gli script.

basta creare 3 stati per l'elemento scelto.


Esempio:


Codice:


div.roll{background-image: url(../images/img1.jpg);
width:100px;
height:45px;}


div.roll a{display: block;
background-image: url(../images/img1.jpg);
width:100px;
height:45px;}

div.roll a:hover{ background-image: url(../images/img1.jpg);
width:100px;
height:45px;}




e poi inserire nella nostra pagina web :

Codice:
 

[url=#]testo non visibile[/url]




e l'effetto ottenuto proprio quello del rollover image.


Ultima modifica di il Sab 10 Nov 2007 - 16:05, modificato 1 volta

_________________
www.webmyl.altervista.org il sito gratuito che offre servizi si webmaster, webdesign, grafica e molto altro..
avatar
WebMyl
Special Admin
Special Admin

Femmina
Numero di messaggi : 117
Et : 34
Data d'iscrizione : 20.10.07

Visualizza il profilo http://www.webmyl.altervista.org

Torna in alto Andare in basso

Re: [CSS] RollOver Images

Messaggio Da Andrew il Lun 5 Nov 2007 - 21:58

Ottimo piccolo suggerimento come primo articolo Wink

Andrew
Utente Plus
Utente Plus

Maschio
Numero di messaggi : 31
Et : 37
Scrivo da : Salerno
Data d'iscrizione : 04.11.07

Visualizza il profilo

Torna in alto Andare in basso

Re: [CSS] RollOver Images

Messaggio Da WebMyl il Mar 6 Nov 2007 - 17:12

Ti ringrazio Wink aspettiamo i tuoi di articoli.

_________________
www.webmyl.altervista.org il sito gratuito che offre servizi si webmaster, webdesign, grafica e molto altro..
avatar
WebMyl
Special Admin
Special Admin

Femmina
Numero di messaggi : 117
Et : 34
Data d'iscrizione : 20.10.07

Visualizza il profilo http://www.webmyl.altervista.org

Torna in alto Andare in basso

Re: [CSS] RollOver Images

Messaggio Da Contenuto sponsorizzato


Contenuto sponsorizzato


Torna in alto Andare in basso

Torna in alto


 
Permessi di questa sezione del forum:
Non puoi rispondere agli argomenti in questo forum