日期:2014-05-16 浏览次数:20318 次
前几天在一个社区中无意看到,有人在写自由落体运动,当时顺手把他的代码copy下来,运行一下,发现没有成功,于是就有了这篇博客!
主要是由一个自由落体函数freeFall(),传入参数element,height,speed,即落体元素,高度,水平速度
/*自由落到函数 *param height : 初始高度; *param speed : 初始速度; */ function freeFall(element, height, speed){ var start = (new Date()).getTime(); var el = element; var originalStyle = el.style.cssText; var timeInterval = 50 ,// 50ms 变换一下速度; left = el.offsetLeft, //初始位置 top = el.offsetTop; // var time = Math.sqrt(2 * height / g) * 1000 // h = 1/2 * g * t * t 算得时间 单位为ms; console.log(originalStyle, left, top, time); moving(); function moving(){ var now = (new Date()).getTime(); var elapsed = now - start; var fraction = elapsed / time; console.log(now, elapsed, fraction); if(fraction < 1){ var x = left + speed * elapsed / 100; //水平位移; 时间单位为ms 所以需要转换; var y = top + 0.5 * g * elapsed * elapsed / 10000; //垂直位移 el.style.left = x + 'px'; el.style.top = y + 'px'; console.log(x, y); setTimeout(moving, Math.min(25, time - elapsed)); }else{ el.style.cssText = originalStyle; //恢复原状 } } }具体的demo在我的github上:https://github.com/chenkehxx/practice/blob/test/freeFall.html