<head>
<meta charset=utf-8>
<title>HTML5-canvas</title>
</head>
<body>
<canvas id="canvas" width="500" height="200" ></canvas>
<div id="ds"></div>
<script type="text/javascript">
var chr = document.getElementById('canvas').getContext("2d");
var width=400;
var height=200;
var start=0
var exp=1;
chr.strokeStyle = "rgba(255,0,0,1)";
function draw(){
chr.clearRect(0,0,width,height)
chr.fillStyle="blue";
chr.beginPath();
chr.arc(180,start,20,0,Math.PI*2,1);
chr.closePath();
chr.fill();
start=start+exp;
if(start==0 || start==height-1){
exp=exp*-1;
}
}
</script>
<input onclick="interval=setInterval(draw,5);" value="开始" type="button" />
<input onclick="clearInterval(interval);" value="停止" type="button" />
</body>
</html>
很急，谢谢啦
这个我知道，但是运行效果是错的
这是写在.js文件夹中的代码
function draw(){
var chr = document.getElementById('canvas').getContext("2d");
var width=400; var height=200; var start=0; var exp=1;
chr.strokeStyle = "rgba(255,0,0,1)"; chr.clearRect(0,0,width,height)
chr.fillStyle="blue"; chr.beginPath(); chr.arc(180,start,20,0,Math.PI*2,true);
chr.closePath(); chr.fill(); start=start+exp;
if(start==0 || start==height-1){ //判断当前线的位置，控制在区域内
exp=exp*-1; //乘以负一用来调整线路方向
}
}
建一个js文件，把js代码写进去，然后再html页面引进js文件。
<script type="text/javascript" src="xx/js/xxx.js" ></script>追问我的意思是JS文件中的代码怎么写，我再补充问题写了一下我在JS文中的代码，但是运行效果出错
帮你完善，并且修复了