来位大神看下这串html5代码，为何时针走跟秒针一样！

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body>
<canvas id="clock" width="500" height="500" style="background:#800040">你的浏览器不支持canavas!</canvas>
<script>
       function colock(){

       var oP=document.getElementById('clock');
       var env=clock.getContext('2d');

       env.clearRect(0,0,500,500);
       env.lineWidth="10"
       env.strokeStyle="yellow";
       env.beginPath();
       env.arc(250,250,200,0,180,false);
       env.stroke();
       env.closePath();



       //整点刻度
       for(var i=0;i<12;i++){
       env.save();
       env.lineWidth=9;
       env.strokeStyle="#000000";
       env.translate(250,250);
       env.rotate(i*30*Math.PI/180);
       env.beginPath();
       env.moveTo(0,-200);
       env.lineTo(0,-170);
       env.closePath();
       env.stroke();
       env.restore();

       }

       //分钟刻度
       for(var i=0;i<60;i++){
       env.save();
       env.lineWidth=7;
       env.strokeStyle="red";
       env.translate(250,250);
       env.rotate(i*6*Math.PI/180);

       env.beginPath();
       env.moveTo(0,-190);
       env.lineTo(0,-180);
       env.closePath();
       env.stroke();
       env.restore();
       }




       var date=new Date();
       var hour=date.getHours();
       var second=date.getSeconds();
       var minute=date.getMinutes();

       var hour=hour>12?hour=hour-12:hour;
       var hour=hour+minute/60;

           //时针

           env.save();
           env.lineWidth=9;
           env.strokeStyle="#000033";
           env.translate(250,250);
           env.rotate(hour*30*Math.PI/180);

           env.beginPath();
           env.moveTo(0,-100);
           env.lineTo(0,4);
           env.closePath();
           env.stroke();
           env.restore();


           //分针
           env.save();
           env.lineWidth=7;
           env.strokeStyle="#ff0033";
           env.translate(250,250);
           env.rotate(minute*6*Math.PI/180);
           env.beginPath();
           env.moveTo(0,-140);
           env.lineTo(0,4);
           env.closePath();
           env.stroke();
           env.restore();


           //秒针
           env.save();
           env.lineWidth=3;
           env.strokeStyle="#000000";
           env.translate(250,250);
           env.rotate(second*6*Math.PI/180);

           env.beginPath();
           env.moveTo(0,-160);
           env.lineTo(0,4);
           env.closePath();
           env.stroke();

           env.beginPath();
           env.arc(0,-120,5,0,360,false);
           env.closePath();
           env.stroke();
           env.restore();
       }
       colock();
       setInterval("colock()",3);
</script>
</body>
</html>

闲闲少优

浏览 1580回答 1

1回答

echo_kinchao

逻辑写错了

0 0

随时随地看视频慕课网APP