cambio sfondo on mouse over

[David_pop]

Salve,
in una cella ho delle parole che fanno parte del menu, una sotto l'altra, e passando sopra la cella col mouse, o sopra le stesse scritte del menu, lo sfondo della cella deve cambiare con altra immagine.

Ho reso questo con il CSS:

.menu_logo {
	background-image: url(../imm/menulogo_out.jpg);
	height: 121px;
	width: 160px;
}
.menu_logo:hover {
	background:   url(../imm/menulogo_over.jpg);
}
.menu_logo:active {
	background:  url(../imm/menulogo_in.jpg);
}

ma non mi legge le immagini da scambiare, ne quella primaria di base, ne quella di scambio.

[thomas_anderson]

Puoi fare in questo modo: dichiari un display:block ad <a>, assegnadogli le giuste dimensioni:

a.logo:link, a.logo:visited {
  width: xx; /* grande come tutto <td> */
   height: xx;
   margin: 0;
   padding: xx;
   display: block;
    background: url(img.gif) no-repeat top left;
}

e poi giochi sull'hover.

[David_pop]

quindi questo code andrebbe aggiunto prima degli Hover?

[thomas_anderson]

No, questo codice sostituisce il tuo codice, che non funziona su IE. devi solo aggiungere
a.logo:hover.

[David_pop]

Ho fatto di questo, ma rimane sfondo grigio senza cambiare..

a.logo:link, a.logo:visited {
  width: 155px; /* grande come tutto <td> */
   height: 118px;
   margin: 0;
   padding: 10;
   display: block;
    background: url((../imm/menulogo_out.jpg) no-repeat top left;
}

a.logo:hover {
	background:   url(../imm/menulogo_over.jpg);
}
a.logo:active {
	background:  url(../imm/menulogo_in.jpg);
}

[thomas_anderson]

hai messo un (( sul primo background: url()..........

[David_pop]

però non carica le immagini ugualmente, rimane sfondo cella vuoto..

[thomas_anderson]

C'è un altro errore nel CSS:

padding: 10;

10px? cmq è buona norma inserire le immagini nella stessa cartella del file CSS per evitare problemi.

[David_pop]

ok tutto a posto, ma nel mozilla firefox non funziona lo scambio ne le immagini di sfondo.. rimane trasparente..

.logo {
	width: 160px;
	height: 121px;
	margin: 0;
             padding: 0px;
	background: url(menulogo_out.jpg);
	
}

.logo:hover {
	background:   url(menulogo_over.jpg);
}
.logo:active {
	background:  url(menulogo_in.jpg);
}