看图哈，这里除了10000，多了个0

var WINDOW_WIDTH=1024;

var WINDOW_HEIGHT=768;

var RADIUS=8;

var MARGIN_TOP=60;

var MARGIN_LEFT=30;

const endTime = new Date(2014,6,11,18,47,52);

var curShowTimeSeconds=0;

var balls=[];

const colors = ["#33B5E5","#0099CC","#AA66CC","#9933CC","#99CC00","#669900","#FFBB33","#FF8800","#FF4444","#CC0000"]

window.onload=function(){

    //   /** @type {HTMLCanvasElement} */ /

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

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

    canvas.width=WINDOW_WIDTH;

    canvas.height=WINDOW_HEIGHT;

    curShowTimeSeconds=getCurrentShowTimeSeconds()

    // render(context)

    setInterval(

        function(){

            render(context)

            update()

        },50

    );

}

function getCurrentShowTimeSeconds(){

    //  /** @type {HTMLCanvasElement} */ 

    var curTime=new Date();

    var ret=endTime.getTime()-curTime.getTime();

        ret= Math.round(ret/1000)

    return ret >= 0 ? ret : 0;

}

function update(){

    //  /** @type {HTMLCanvasElement} */ 

    var nextShowTimeSeconds=getCurrentShowTimeSeconds();

    var nextHours=parseInt( nextShowTimeSeconds/3600 );

    var nextMinutes=parseInt( (nextShowTimeSeconds-nextHours*3600)/60 );

    var nextSeconds=nextShowTimeSeconds%60;

    var curHours=parseInt( curShowTimeSeconds/3600 );

    var curMinutes=parseInt( (curShowTimeSeconds-curHours*3600)/60 );

    var curSeconds=curShowTimeSeconds%60;

    if(nextSeconds !=curSeconds){

        curShowTimeSeconds=nextShowTimeSeconds;

    }

}

function render(cxt) {

    //  /** @type {HTMLCanvasElement} */ //获得canvas语法提示

    cxt.clearRect(0,0,WINDOW_WIDTH,WINDOW_HEIGHT);

    var hours=parseInt( curShowTimeSeconds/3600 );

    var minutes=parseInt( (curShowTimeSeconds-hours*3600)/60 );

    var seconds=curShowTimeSeconds%60;

    renderDigit(MARGIN_LEFT,MARGIN_TOP,parseInt(hours/10),cxt)

    renderDigit(MARGIN_LEFT+15*(RADIUS+1),MARGIN_TOP,parseInt(hours%10),cxt)

    renderDigit(MARGIN_LEFT+30*(RADIUS+1),MARGIN_TOP,10,cxt)

    renderDigit(MARGIN_LEFT+39*(RADIUS+1),MARGIN_TOP,parseInt(minutes/10),cxt)

    renderDigit(MARGIN_LEFT+54*(RADIUS+1),MARGIN_TOP,parseInt(minutes%10),cxt)

    renderDigit(MARGIN_LEFT+69*(RADIUS+1),MARGIN_TOP,10,cxt)

    renderDigit(MARGIN_LEFT+78*(RADIUS+1),MARGIN_TOP,parseInt(seconds/10),cxt)

    renderDigit(MARGIN_LEFT+93*(RADIUS+1),MARGIN_TOP,parseInt(seconds%10),cxt)

}

function renderDigit(x,y,num,cxt){

        // /** @type {HTMLCanvasElement} */ //获得canvas语法提示

    cxt.fillStyle="rgb(0,102,153)";

    for(var i=0;i<digit[num].length;i++)

        for(var j=0;j<digit[num][i].length;j++)

         if(digit[num][i][j]==1){

             cxt.beginPath();

             cxt.arc(x+j*2*(RADIUS+1)+(RADIUS+1),y+i*2*(RADIUS+1)+(RADIUS+1),RADIUS,0,2*Math.PI);

             cxt.closePath();

             cxt.fill()

         }

}

有没有精确度相关的计算出差的误差呢

有没有添加摩擦系数，在每次碰撞后，速度取反，再乘以一个0至1的系数就可以了。

贴代码啊，同学，不看代码很难精准定位问题。

这样说也没错，不过如果用加速度方向和速度方向相反的方法怎么在代码里实现呢？？(｀・ω・´)

没有小球生成的部分啊

怎么实现多个小球随机跳动，不要有倒计时的效果。请看一下还差了什么。

ball.x += ball.vx;

ball.y += ball.vy;

ball.vy += ball.g;

小球的速度没有任何的减损 ，随着时间的增长小球的速度自然越来越快

setInterval() 本身的作用就是让update()不断的执行，所以，球已经继续下落了，不会回来的，老师只是刷新了一下页面...

检验一下 获取当地时间是否正确

判断小球的坐标到屏幕底部后，将小球的y方向速度设置为负。

你可以把定时器里面的时间设置的短一点 一般1000毫秒30帧人眼就看起来很连贯了，你可以把定时器里面的时间设置为30 或者20；帧数只要够多 就算一帧移动1000个像素你也看起来很连贯的

知道了

没有引入教程提供的digit.js文件

已解决，谢谢

你试试这个呢

// 小球的速度小于小球半径时, 小球停留在底部
if (Math.abs(ball.vy)<=ball.r) {
  ball.g=ball.vy=0;
  ball.y=ctx.canvas.height - ball.r;
}

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

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

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

从数学的角度，可以变成0，用极限的思想。

这是一个物理效果。着地的一瞬间，假设速度是100。然后以100的速度反方向上弹，以为有向下的加速度g在，所以这个-100+g就会 变成越小的正数，知道这个整数变为0。这时是小球的最高点，接着一直有重力g存在小球的ball.vy有开始向正数增大，关键来了。这次的增大是从0 开始的，而第一次下落是从ball.y是负值开始的，所有一开始我的vy(2)就比第一次vy(1)要快，因此到达地面是这个vy(2)的速度就比第一次到达终点的要大，所有第二次反弹的速度就变成了-102。而g不变，-102+g要经历更多的距离才能为0停止。所有第三次小球又比第二次高了，进而更高的地方掉落的小球到达地面的速度更加大，反弹又再次升高，这样递增下去。我是这样简单理解的。当然具体函数关系肯定不止是这么简单。

你还用现实的理论 去探讨小球的运动？  你让它反弹后直接往上飞 都是可以的、、、你推算一下小球的vy为0时 y轴的 坐标 

可以的 我问题已经解决了

var mytime=new Date（）

 function update(){  

ball.x += ball.vx;    ball.y += ball.vy;    ball.vy += ball.g;   

 if(ball.y>=768){     //加上这一句，就可以重复运动了

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

} } 

跳出去是因为没做两侧的碰撞检测。老师的也会跳到屏幕外边去的。还有设定加速度的问题，你左右的速度如果设定的太快了，那就很快的跳出去。

哎，我的也不动