我的怎么没有效果呀?

来源:4-2 使用canvas做个物理实验

慕粉3502838

2016-07-24 14:20

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>javascript</title>

</head>

<body>

    <canvas id="canvas" style="border:1px solid #aaa;display:block;margin:50px auto;">

        当前浏览器不支持Canvas,请更换浏览器后再试

    </canvas>


<script>

var ball={x:512,y:100,r=20,g:2,vx:-4.vy:0,color:"#005588"}

window.onload=funtion(){

    var canvas=document.getElementById('canvas');


    canvas.width=1024;

    canvas.height=768;


    var context=canvas.getContext("2d");


    setInterval(

         funtion(){

            render(context);

            update()

         },

         50

        )

}

function update(){

    ball.x +=ball.vx

    ball.y+=ball.vy

    ball.vy+=ball.g

}

funtion render(cxt){

    cxt.clearRect(0,0,cxt,canvas.width,canvas.height);


    cxt.fillStyle=ball.color

    cxt.arc(ball.x,ball.y,ball.r,0,2*Math.PI)


    cxt.fill()

}

</script>

<!--

    <script src="digit.js"></script>

    <script src="countdown.js"></script>

!-->

</body>

</html>


写回答 关注

2回答

  • qq_曼卿_0
    2016-07-24 18:03:11
    已采纳
    cxt.clearRect(0,0,cxt,canvas.width,canvas.height);

    这句代码有问题,clearRect只包含了四个参数,不需要传入画布

    至于其他的bug 我没下载来看  所以要你自己fire Bug


    慕粉3502...

    非常感谢!

    2016-12-14 20:57:59

    共 1 条回复 >

  • 慕粉4042427
    2016-12-17 09:50:38

    1,{x:512,y:100,r=20,g:2,vx:-4.vy:0,color:"#005588"}

    2,funtion应为function

炫丽的倒计时效果Canvas绘图与动画基础

学习HTML5中最激动人心的技术Canvas,彻底释放自己的创造力

96746 学习 · 1000 问题

查看课程

相似问题