Ho un menu, contenente diversi collegamenti. Voglio che questi collegamenti abbiano un effetto luminoso sullo sfondo quando li alzo.CSS3: sfondo incandescente sul link-hover (non a incandescenza del testo)
L'ho quasi fatto usando la transizione css, box-shadow e un colore di sfondo più chiaro sui collegamenti.
Il problema è che l'effetto di transizione influisce sull'ombra di casella, in modo che quando inizia la transizione, i collegamenti non abbiano un'ombreggiatura, che dà loro un colore di sfondo al quadrato. Quando la transizione è terminata, lo sfondo luminoso sembra buono.
Vedere il mio jsFiddle: http://jsfiddle.net/xCJ46/.
Gradirei molto il vostro aiuto con questo.
Ecco un estratto del mio CSS:
<html><style>
div a:hover {
background: #527fa9;
-webkit-box-shadow: inset 0 0 30px 15px #49628a;
-moz-box-shadow: inset 0 0 30px 15px #49628a;
box-shadow: inset 0 0 30px 15px #49628a;
-webkit-transition: 500ms linear 0s;
-moz-transition: 500ms linear 0s;
-o-transition: 500ms linear 0s;
transition: 500ms linear 0s;
}
</style></html>
Aggiungi l'ombreggiatura alla proprietà del collegamento (non al passaggio del mouse). F.e. div a {box-shadow: riquadro 0 0 30px 15px # 49628a; } – reinder