这个动画有什么问题?
.homepage-box:hover .shadow-layer
{
opacity:0.70;
-webkit-animation: opacity 5s;
-moz-animation: opacity 5s;
}
在chrome / firefox中我都看不到不透明度的消失......
答案 0 :(得分:4)
您需要按原样设置父属性的转换(因此不要设置:hover)。
.homepage-box .shadow-layer {
opacity: 1;
transition: opacity 5s ease-in-out;
-moz-transition: opacity 5s ease-in-out;
-webkit-transition: opacity 5s ease-in-out;
}
.homepage-box:hover .shadow-layer {
opacity: 0.7;
}
答案 1 :(得分:0)
更改为transition
非动画
也许这就是你想要的我想到的JS Fiddle