Przejście w CSS3 Łatwość wejścia i wyjścia Box Shadow

Question

Próbuję uzyskać identyfikator div, aby ułatwić wchodzenie i wychodzenie z cienia pudełka przy użyciu CSS3.

Obecny CSS mam to:

#how-to-content-wrap-first:hover { 
-moz-box-shadow: 0px 0px 5px #1e1e1e; 
-webkit-box-shadow: 0px 0px 5px #1e1e1e; 
box-shadow: 0px 0px 5px #1e1e1e; 
-webkit-transition: box-shadow 0.3s ease-in-out 0s; 
-moz-transition: box-shadow 0.3s ease-in-out 0s; 
-o-transition: box-shadow 0.3s ease-in-out 0s; 
-ms-transition: box-shadow 0.3s ease-in-out 0s; 
transition: box-shadow 0.3s ease-in-out 0s; 

Problem mam jest to, że na pierwszym aktywowaniu elementu nie jest złagodzenie lub pomniejszyć i następnie wszelkie późniejsze Hovers łatwość ale nie złagodzić na zewnątrz.

Każda rada ludzi byłaby doceniona?

Answer 1

Trzeba użyć przejścia na .class i nie .class:hover

Demo

div { 
    height: 200px; 
    width: 200px; 
    box-shadow: none; 
    transition: box-shadow 1s; 
    border: 1px solid #eee; 
} 

div:hover { 
    box-shadow: 0 0 3px #515151; 
}