<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
=======================
<style type="text/css">
*{padding:0;margin:0;}
body{font-size:13px;padding:10px;}
p{margin:2px;}
.wrap{position:relative;width:1000px;height:550px;margin:0 auto;border:1px solid #ccc;margin-top:50px;}
#fall{width:20px;font-size:1px;height:20px;background:#000;position:absolute;top:0;left:0;}
</style>
<h3>模拟重力状态下的抛物运动（假使1px==1mm）</h3>
<p>横向初速度：<input id="Vx" type="text" value="0" />px/ms</p>
<p>纵向初速度：<input id="Vy" type="text" value="1" />px/ms</p>
<p>重力加速度：<input id="a" type="text" value="0.1" />px/平方ms</p>
<p>（如果这个加速度是一个随时间变化的值，就能达到其他非匀加速运动的效果了。）</p>
<p>单位时间：<input id="t" type="text" value="2" />（记录运动的时间间隔）
<p><input type="button" value="演示" onclick="demo1(document.getElementById('Vx').value, document.getElementById('Vy').value, document.getElementById('a').value, document.getElementById('t').value)"/></p>
<div class="wrap">
<div id="fall">o</div>
</div>
<script type="text/javascript">
function demo1(x,y,a,t) {
var f=document.getElementById('fall');
var Vx=parseInt(x),
Vy=parseInt(y),
g=a,
t=parseInt(t),
h=0,l=0,Sx=0,Sy=0;
var i=setInterval(function(){
if(f){
Sx+=Vx*t;
l=Sx;
Vy+=g*t;
h+=Vy*t;
f.style.left=l+'px';
f.style.top=h+'px';
if(h>500||l>900)clearInterval(i);
}
},t);
}
</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
<head >
<title>重物落地</title>
<style type="text/css" >
#container{position:relative;border:1px solid red;width:800px;height:600px; border-top-width:0;}
#m{position:absolute;left:50%;top:0;width:100px;height:50px;border:1px solid blue;}
</style>
</head>
<body >
<input type="button" onclick="startdown()" value="down" /> <input type="button" onclick="stopdown()" value="stop" />
<div id="container">
<div id="m"></div>
</div>
<script type ="text/javascript" language ="javascript" >
var h = 550;//600-50;重物初始高
var a = 1;//重力加速度
var k = 0.5;//碰撞能量损失系统数
var m = document.getElementById("m");//重物DIV
m.v = 0;//初速度，可以试一下初速大于零（下压）和小于零（上抛）的情况
m.y = 0; // 记录重物的下落位置,这个变量可以用parseFloat( m.sytle.top)来获得，这里设置一个变量是为了提高运行速度
var jump = 0;//弹跳次数
var timer; //记时器
function startdown() {
if (!timer) {
timer = window.setInterval("down()",20)
}
}
function down() { //下落
//先用加速度公式计算这段时间内假如没有碰到地面时，速度的增加和高度的降落
var v2, y2;
v2 = m.v + a;
y2 = (v2 * v2 - m.v * m.v) / 2 / a + m.y;
if (y2 > h) {//如果高度降落已经超出了地面，则修正为到达地面，并修正速度
v2=Math.sqrt(2*a*(h-m.y)+m.v * m.v);
m.y = h;
m.v = -v2 * k; //碰撞反弹
jump++;//
}
else{
m.v = v2;
m.y = y2;
}
m.style.top = m.y + 'px';
if ((h - m.y < 1) && Math.abs(m.v) < 1) //如果与地面距离小于1个像素，并且速度小于1,停止，如果想强制最多两次，则 || jump>2
{stopdown();alert("共弹跳"+jump +"次,现在要消失了");m.style.display = "none"; }
}
function stopdown() {
if (timer) {
window.clearInterval(timer);
timer = null;
}
}
</script>
</body>
</html>
