html css纯写桌球运动轨迹,纯JS实现椭圆轨迹运动的代码

#div1 {

margin:100px auto;

width:5px;

height:5px;

background:green;

position:relative;

}

#box {

width:50px;

height:50px;

background:url(//ku.shouce.ren/files/images/201601/56a36cac3d89c.gif) no-repeat;

position:absolute;

left:0;

top:0;

}

椭圆轨迹移动

window.οnlοad=function() {//运动轨迹随便写的一个(x/300)2+(y/100)2=1椭圆方程

var oDiv=document.getElementById('box');

var oTxt=document.getElementById('txt');

var m=-300;

var n=300;

var y=0;

var x=0;

function move() {

if(m<=300) {

x=m;

b();

}

else {

x=n;

a();

if(x

clearInterval(timer);

m=-300;

n=300;

timer=setInterval(move,5);

}

}

oDiv.style.left=x+'px';

oDiv.style.top=parseInt(y)+'px';

oTxt.value="top="+oDiv.style.top+'\n'+"left="+oDiv.style.left+'\n'+"X="+x+'\n'+"M="+m+'\n'+"N="+n;}

function a(){

n-=1;

y=Math.sqrt(1-Math.pow(n/300,2))*100;

}

function b(){

m+=1;

y=Math.sqrt(1-Math.pow(m/300,2))*-100;

}

move();

var timer=setInterval(move,5);

}