Animation - 如何創(chuàng)建動(dòng)畫腳本
我們想知道如何創(chuàng)建動(dòng)畫腳本。
<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
div.flipper {
position: relative;
-webkit-perspective: 800;
margin: 100px auto;
width: 300px;
height: 300px;
}
div.flipper div {
-webkit-backface-visibility: hidden;
position: absolute;
-webkit-transition: 280ms ease-in-out;
}
div.flipper div.back {
-webkit-transform: rotatey(-180deg);
}
div.flipper:hover div.front {
-webkit-transform: rotatey(180deg);
}
div.flipper:hover div.back {
-webkit-transform: rotatey(0deg);
}
</style>
</head>
<body>
<div class='flipper'>
<div class='front'>
<img src='http://placehold.it/300x300' />
</div>
<div class='back'>
<img src='http://placehold.it/301x301' width='300' height='300' />
</div>
</div>
</body>
</html>
【flip】
