以下是 css3仿淘宝支付成功打勾动画特效css代码. 的示例演示效果:
部分效果截图:
HTML代码(index.html):
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>css3仿淘宝支付成功打勾动画特效</title>
<style type="text/css">
div{position: relative;}
div img{width: 100px;height: 100px;}
.div11{position: absolute;width: 100px;height: 100px;animation: myfirst 5s;
-moz-animation: myfirst 3s; /* Firefox */
-webkit-animation: myfirst 3s; /* Safari 和 Chrome */
-o-animation: myfirst 3s;top: 0;background:#fff;left:0;}
@keyframes myfirst
{
0% {left: 0;}
100% {left:100px;}
}
@-moz-keyframes myfirst /* Firefox */
{
0% {left: 0;}
100% {left:100px;}
}
@-webkit-keyframes myfirst /* Safari 和 Chrome */
{
0% {left: 0;}
100% {left:100px;}
}
@-o-keyframes myfirst /* Opera */
{
0% {left: 0;}
100% {left:100px;}
}
</style>
</head>
<body>
<div>
<img src="duihao.png"/>
<div class="div11"></div>
</div>
</body>
</html>
分享到QQ
分享到微博
微信扫一扫
