为什么鼠标移上去不会停止
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>canvas动画</title>
<style>
canvas{background-color:lightblue;}
</style>
</head>
<body>
<canvas width="800px" height="800px" id="canvas">您的浏览器不支持canvas</canvas>
<script>
var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");
var parX=30
parY=0
zk=1
ismove=false;
canvas.onmousemove=function(e){
var moveX=e.offsetX;
var moveY=e.offsetY;
if(moveX>parX && moveX<parX+50 && moveY>parY && moveY<parY+50 ){
ismove=true;
}else{
ismove=false;
}
}
setInterval(function(){
parY=parY+10*zk;
ctx.clearRect(0,0,canvas.width,canvas.height);
ctx.fillStyle='green';
ctx.fillRect(parX,parY,50,50);
if(parY+50>=canvas.height){
zk=-1;
}else if(parY<=0){
zk=1;
}
},100)
</script>
</body>
</html>
正在回答 回答被采纳积分+1
- 参与学习 人
- 提交作业 467 份
- 解答问题 4826 个
本路径带你通过系统学习HTML5、JavaScript、jQuery的进阶知识,不仅如此,还会学习如何利用组件化的思想来开发网页,知识点+案例,使得所学可以更好的得到实践。
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星