JS画完圆球

翻译

图1

图(2)

代码如下：

headtitlejs动画的Html旋转球/title style type=' text/CSS ' div { width :20 px；高度：20 px；背景-颜色：黑色；位置：绝对；border:1px纯红；边界半径：50%；}/style/head dydiv id=' box '/div script type=' text/JavaScript ' var box=document . getelementbyid(' box ')；box . style . left=' 600 '；box . style . top=' 300 px '；var n=0；//正弦函数横坐标表示时间轴较好。函数旋转(){ box . style . left=(600-math . sin(1/180)* 80)math . sin(n/180)* 80 ' px '；//300是没有开始移动的球的初始位置，n代表时间轴，后面跟着除数来细分时间，让移动更流畅，80代表半径。box . style . top=(300-Math . cos(1/180)* 80)Math . cos(n/180)* 80 ' px '；//第一个括号中的内容是球开始移动时的初始位置(300，300) var dr=document。create element(' div ')；dr . style . left=(600-math . sin(1/180)* 80)math . sin(n/180)* 80 ' px；dr . style . top=(300-math . cos(1/180)* 80)math . cos(n/180)* 80 ' px '；document . body . appendchild(dr)；n；if(n180*2*Math。PI)返回假；//0到2是一个旋转周期。如果要半圆，只需要将n的值范围减半，如果要反方向旋转，可以改变左、上的值。setTimeout(旋转，1)；} rotation()；/script/body/html以上就是本文的全部内容。希望这篇文章的内容能给大家的学习或工作带来一些帮助，也希望大家多多支持我们！