如何使用CSS完成懸停後淡出

Question

我有一個圖像，其懸停時其背景顏色會發生變化。

它需要1秒鐘來改變顏色，但只要走出圖像，它就會改變而沒有任何效果。

如何才能淡化背景顏色的效果？

CSS：

.latestTrack { 
    margin:80px 0 0 0 !important; 
} 
.latestTrack img { 
    float:right; 
    margin-right:50px !important; 
} 
.latestTrack img:hover 
    -webkit-transition: all 1s ease; 
    -moz-transition: all 1s ease; 
    -o-transition: all 1s ease; 
    -ms-transition: all 1s ease; 
    transition: all 1s ease; 
    background-color:#f7710f; 

} 

HTML：

<img src="img/SocIco/soundcloud-large.png" /> 

Answer 1

你忘了緩出部分：

.latestTrack img { 
    float:right; 
    margin-right:50px !important; 
    -webkit-transition: all 1s ease-out; 
    -moz-transition: all 1s ease-out; 
    -o-transition: all 1s ease-out; 
    -ms-transition: all 1s ease-out; 
    transition: all 1s ease-out; 
} 

jsFiddle example here.