- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- Transizione sfondo menù non funziona
-
Transizione sfondo menù non funziona
Salve a tutti,
sto cercando di far apparire lentamente un'immagine png al passaggio del mouse sopra le voci di un menù. L'immagine sarebbe un'ombra sotto il testo. Purtroppo l'ombra appare senza transizione.Link del sito: w w w . cantinevinci.altervista.org
Il codice:
[HTML]
.sf-menu > li > a {
font: 18px/22px "Copperplate Gothic Light";
font-weight:300;
text-transform: uppercase;
color: #013224;
display: block;
padding: 10px 20px;
line-height: 80px;
vertical-align:top;
}
.sf-menu > li.sfHover > a,
.sf-menu > li > a:hover, .sf-menu > li.sfHoverForce > a {
background-image: url(img/ombra.png);
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-transition-property: background-image 300ms ease-in 200ms;
-moz-transition-property: background-image 300ms ease-in 200ms;
-o-transition-property: background-image 300ms ease-in 200ms;
transition: background-image 300ms ease-in 200ms;
}
[/HTML]Mi è stato suggerito di spostare la transizione in .sf-menu > li > a, ma non funziona ugualmente.
Dove sbaglio?
Grazie per l'aiuto che potrete darmi.
-
Up
