animation动画 财富值53

2016-10-21 16:31发布

站内问答 /
745 0 4

页面一加载就执行animation动画，在hover时停止动画并translateY（100px），可是怎么没有执行translateY动画

<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style>  img{          animation:shake 1s linear infinite;     -webkit-animation:shake 1s linear infinite;     } @-webkit-keyframes shake {     0%,100% {         -webkit-transform: translate3d(0,0,0);         transform: translate3d(0,0,0);     }      10%,30%,50%,70%,90% {         -webkit-transform: translate3d(-10px,0,0);         transform: translate3d(-10px,0,0);     }      20%,40%,60%,80% {         -webkit-transform: translate3d(10px,0,0);         transform: translate3d(10px,0,0);     } }  @keyframes shake {     0%,100% {         -webkit-transform: translate3d(0,0,0);         -ms-transform: translate3d(0,0,0);         transform: translate3d(0,0,0);     }      10%,30%,50%,70%,90% {         -webkit-transform: translate3d(-10px,0,0);         -ms-transform: translate3d(-10px,0,0);         transform: translate3d(-10px,0,0);     }      20%,40%,60%,80% {         -webkit-transform: translate3d(10px,0,0);         -ms-transform: translate3d(10px,0,0);         transform: translate3d(10px,0,0);     } } img:hover{     animation-play-state:paused;     transform:translateY(100px);} </style> </head>  <body> <img src="hospital/images/1.png"> </body> </html>
友情提示: 问题已经关闭,关闭后问题禁止继续编辑，回答。
该问题目前已经被作者或者管理员关闭, 无法添加新回复
0条回答

一周热门 更多>