problema hover sul cambio immagine

[albezz]

un saluto a tutti ragazzi! eccovi il mio problema

in IE6 funziona in IE7 firefox e opera mi cambia il colore del testo ma non l'immagine!



eccovi il codice

.leftCant a{
color : #000000;
text-align: Left;
display: block;
background-image: url("images/bottone.gif");
background-image: no-repeat;
width:145px;
height:30px;
padding: 5px 20px 5px 5px;
margin: 5px 5px 5px 5px;
font-size : 11px;
font-family : Tahoma,Verdana,Arial;
font-weight: bold;
text-decoration: none;

}
.leftCant a:link {
color : #000000;
text-align: Left;
background-image: url("images/bottone2.gif");
background-image: no-repeat;
width:145px;
height:30px;
padding: 5px 20px 5px 5px;
margin: 5px 5px 5px 5px;
font-size : 11px;
font-family : Tahoma,Verdana,Arial;
font-weight: bold;
text-decoration: none;

}


.leftCant a:hover {
color : #FFFFFF;
display: block;
text-align: Left;
background-image: url("images/bottone2.gif");
background-image: no-repeat;
width:145px;
height:30px;
padding: 5px 20px 5px 5px;
margin: 5px 5px 5px 5px;
font-size : 11px;
font-family : Tahoma,Verdana,Arial;
font-weight: bold;
text-decoration: none;

}


<p class="leftCant"> ><?php echo $valore; ?></p>




grazie!

[Gufo]

Ho provato il tuo codice così cme tu l'hai postato e funziona sia su IE7 IE6 FF2 FF3 FF3.0.5

[Mich_]

Togli le virgolette da dentro le parentesi dell'url, e controlla il path: deve essere relativo alla posizione del CSS, non della pagina HTML.

[albezz]

mi sono spiegato male..

funziona in tutti i browser ma in IE6 non c'è l'attesa del caricamento dell'immagine hover mentre sugli altri browser vedo lo "stacco" tra l'immagine di base e quella hover!


thanks

[Gufo]

Originariamente inviato da albezz
mi sono spiegato male..

funziona in tutti i browser ma in IE6 non c'è l'attesa del caricamento dell'immagine hover mentre sugli altri browser vedo lo "stacco" tra l'immagine di base e quella hover!


thanks

Se la seconda immagine è pesante lo vedi sicuramente, ma al secondo passaggio non dovresti più vederlo perchè l'immagine è giò stata caricataed è nella cache, io l stacco non lo vedo neanche al primo caricamento, non è che hai un PC lentuccio

[albezz]

sono entrambe 2k! il mio pc ha 4gb di ram ed un intel core 2 duo t8300 ...non credo proprio sia quello il problema

è proprio il primo passaggio che voglio eliminare! ripeto in IE6 funziona! mentre negli altri no!

[Mich_]

Bottoni con rollover
Rollover creativi
Menu grafici con rollover e preload via CSS
Fast Rollovers Without Preload
Bottoni con rollover flessibili
Non so se tutti i link c'entrano con il problema: il primo, il terzo e il quarto dovrebbero essere i piu` mirati.

[albezz]

ho risolto cosi!


.leftCant a{
color : #000000;
float: left;
height: 40px;
text-align: Left;
background-image: url("images/bottone_double2.png");
background-image: no-repeat;
background-position: top left;
width:160px;
padding-left:10px;
margin-top: 10px;
font-size : 11px;
font-family : Tahoma,Verdana,Arial;
font-weight: bold;
text-decoration: none;
text-transform: capitalize;
text-indent: 10px;
}


.leftCant a:hover {
color : #FFFFFF;
background-position: bottom left;

}