这是代码：
每次点击按钮，我都需要45°来旋转它：
0到45-45到90-90到135等等无限的。
如果你们帮帮我的话会很棒。
<style type="text/css">
.classname {
-webkit-animation-name: cssAnimation;
-webkit-animation-duration:0.7s;
-webkit-animation-iteration-count: 1;
-webkit-animation-timing-function: ease;
-webkit-animation-fill-mode: forwards;
}
@-webkit-keyframes cssAnimation {
0% { -webkit-transform:scale(1) rotate(0deg); }
95% { -webkit-transform:scale(1) rotate(46deg); }
100% {-webkit-transform:scale(1) rotate(45deg); }
}
</style>
<script type="text/javascript">
function ani(){
document.getElementById('img').className ='classname';
}
</script>
<title>Untitled Document</title>
</head>
<body align="center">
<form type="button" onclick="ani()" style="position:relative;z-index:2" name="img" >
<img src="2.png" width="645" height="545" style="position:absolute;left:26.9%;top:-8%;z-index:1;"/>
答案 0 :(得分：0)
这不是一个完全可行的解决方案，主要是因为当旋转经过180度时它不知道如何处理。你必须明白这一点：
$("button").click(function() {
var matrix = $("img").css("-webkit-transform");
var values = matrix.split('(')[1].split(')')[0].split(',');
var a = values[0];
var b = values[1];
var current = Math.round(Math.atan2(b, a) * (180 / Math.PI));
var newz = current + 45;
$("img").css("-webkit-transform", "rotate(" + newz + "deg)");
});