#小风车代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
body{
margin:0 0 0 0;
background-image: url(img/caodi.png);
}
img{
width: 400px;
}
#i1{
position: absolute;
top: 250px;
left: 380px;
}
#i2{
position: absolute;
top: 500px;
left: 830px;
}
#i3{
position: absolute;
top: 420px;
left: 1205px;
}
</style>
</head>
<body>
<button type="button" onclick="start(80)">一档</button><button type="button" onclick="start(40)">二档</button>
<button type="button" onclick="start(10)">三档</button><button type="button" onclick="stop()">暂停</button>
<img src="./img/fengche.png" alt="" id="i1"/>
<img src="./img/fengche.png" alt="" id="i2"/>
<img src="./img/fengche.png" alt="" id="i3"/>
<script type="text/javascript">
var interval=null;
function start(i){
stop();
interval=setInterval(method,i);
}
var k=0;
function method(){
k+=10;
if(k>360){
k=0;
}
var img=document.getElementsByTagName("img");
for(var j=0;j<img.length;j++){
img[j].style.transform=('rotate('+k+'deg)');
}
}
function stop(){
if(interval!=null){
clearInterval(interval);
}
}
</script>
</body>
</html>
