頁(yè)面一加載就執(zhí)行animation動(dòng)畫(huà),在hover時(shí)停止動(dòng)畫(huà)并translateY(100px),可是怎么沒(méi)有執(zhí)行translateY動(dòng)畫(huà)
<!doctype html> <html> <head> <meta charset="utf-8"> <title>無(wú)標(biāo)題文檔</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>