我试图在纯css中实现“淡出”效果.这是
fiddle
我确实在线查看了几个解决方案.但是在阅读了
documentation online之后
我试图弄清楚为什么幻灯片动画不起作用.有什么指针吗？
这是HTML
Saved
CSS
.dummy-wrap {
animation: slideup 2s;
-moz-animation: slideup 2s;
-webkit-animation: slideup 2s;
-o-animation: slideup 2s;
}
.success-wrap {
width: 75px;
min-height: 20px;
clear: both;
margin-top: 10px;
}
.successfully-saved {
color: #FFFFFF;
font-size: 20px;
padding: 15px 40px;
margin-bottom: 20px;
text-align: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background-color: #00b953;
}
@keyframes slideup {
0% {
top:0px;
}
75% {
top:0px;
}
100% {
top:-20px;
}
}
@-moz-keyframes slideup {
0% {
top:0px;
}
75% {
top:0px;
}
100% {
top:-20px;
}
}
@-webkit-keyframes slideup {
0% {
top:0px;
}
75% {
top:0px;
}
100% {
top:-20px;
}
}
@-o-keyframes slideup {
0% {
top:0px;
}
75% {
top:0px;
}
100% {
top:-20px;
}
}
