Este artigo descreve o método de JavaScript para simular o movimento parabólico sob o estado da gravidade. Compartilhe para sua referência. A análise específica é a seguinte:
Este código JavaScript simula o movimento da parábola no estado da gravidade e pode definir os seguintes parâmetros: velocidade inicial horizontal, velocidade inicial longitudinal, aceleração da gravidade (se essa aceleração é um valor que muda com o tempo, outro movimento de aceleração não uniforme pode ser alcançado), intervalos de animação, etc.
<! doctype html> <html> <head> <title> JS Parabolic Motion </title> <meta charset = "utf-8" /> <estilo type = "text/css">*{preenchimento: 0; margem: 0;} corpo {Size da fonte: 13px; preenchimento: 10px;} p {margem: 2px;}. wrap {position: relativa; largura: 1000px; altura: 550px; margin: 0 auto; #ccc; margin-top: 50px;}#outono {width: 20px; font-size: 1px; altura: 20px; background:#000; posição: absoluto; topo: 0; esquerda: 0;} </style> </head> <body> <h3> simular o parabólico no estado da gravidade (se 1px> 1) id = "vx" type = "text" value = "2"/> px/ms </p> <p> velocidade inicial longilina: <input id = "vy" type = "text" value = "-2"/> px/ms </p> <p> aceleração do grão: <input Id = "a" type = "text"/"= p. Um valor que muda ao longo do tempo, outros movimentos não uniformes de aceleração podem ser alcançados.) </p> <p> Tempo da unidade: <input id = "t" type = "text" value = "10" /> (registre o intervalo de tempo do movimento) <p> <input type = "button" = "Demo" OnClick = "Demo (document.getById (Value" "" ") document.getElementById ('vy'). value, document.getElementById ('a'). value, document.getElementById ('t'). value) "/> </p> <div> <div id =" Fall "> o </div> </div> </body> <script," text/javascript "> function (y) f = document.getElementById ('outono'); 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+'p x '; f.style.top = h+' px '; if (h> 500 || l> 900) ClearInterval (i);}}, t);} </sCript> </html>Espero que este artigo seja útil para a programação JavaScript de todos.