12 Mayıs 2012, CUMARTESİ
CSS: fare-geçiş opaklık?
.item:hover {
zoom: 1;
filter: alpha(opacity=50);
opacity: 0.5;
-webkit-transition: opacity .15s ease-in-out;
-moz-transition: opacity .15s ease-in-out;
-ms-transition: opacity .15s ease-in-out;
-o-transition: opacity .15s ease-in-out;
transition: opacity .15s ease-in-out;
}
Bunu neden sadece ben hover yaparken opaklık animasyon ama nesne gidince fare ile değil mi?
Demo burada: http://jsfiddle.net/7uR8z/
CEVAP
12 Mayıs 2012, CUMARTESİ
Sadece elemanın kendisi için :hover
sözde sınıf, ve geçişler uygulamak.
.item {
height:200px;
width:200px;
background:red;
-webkit-transition: opacity 1s ease-in-out;
-moz-transition: opacity 1s ease-in-out;
-ms-transition: opacity 1s ease-in-out;
-o-transition: opacity 1s ease-in-out;
transition: opacity 1s ease-in-out;
}
.item:hover {
zoom: 1;
filter: alpha(opacity=50);
opacity: 0.5;
}
Demo: http://jsfiddle.net/7uR8z/6/
Eğer geçiş mouse-over
olay etkisi istemesen bile, ama sadece mouse-out
geçişler :hover
devlet için kapatabilirsiniz :
.item:hover {
-webkit-transition: none;
-moz-transition: none;
-ms-transition: none;
-o-transition: none;
transition: none;
zoom: 1;
filter: alpha(opacity=50);
opacity: 0.5;
}
Bunu Paylaş:
Kesin olarak yerleştirilmiş üzerinden ...
Normalize tarayıcılarda hızlı fare tek...
Nasıl benim fare giriyor kadar Twitter...
Opaklık CSS arka Plan...
Öğeleri fare hareketleri ile değişen i...