[英]CSS3 Transition easing in IE10+ not working
我剛剛注意到,將鼠標懸停在某物上不起作用。 它具有縮放效果,但它是即時的,而不是縮小和縮小。 IE是否有解決方法?
CSS:
.nav-tile {
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
height: 130px;
width: 360px;
margin-bottom: 10px;
margin-left: 10px;
background-size: 130%;
overflow: hidden;
-moz-transition: all 0.2s;
-webkit-transition: all 0.2s;
-o-transition: all 0.2s;
-ms-transition: all 0.2s;
transition: all 0.2s;
float:left;
}
.nav-tile:hover {
transition: transform 3s linear;
background-size: 100%;
-moz-transition: all 3s;
-webkit-transition: all 3s;
-o-transition: all 3s;
-ms-transition: all 3s;
transition: all 3s;
}
如果要使其緩入和緩出,請嘗試使用此方法,而不要使用“ linear”屬性,請將緩動設置為“ ease-in-out”。
這是css3中所有可能的緩動效果的示例。
http://css3.bradshawenterprises.com/transitions/
.nav-tile:hover {
transition: transform 3s ease-in-out;
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.