自由落体和抛物线运动

自由落体是个加速的过程，让速度递加，再给速度个系数，减小速度即可

抛物线是在自由落体的前提下left也会变，速度，速度系数

js函数

//自由落体和抛物线运动
function fallMove(obj) {var speed = 0;var speedX = 10;clearInterval(obj.timer);obj.timer = setInterval(function() {speed += 3;var T = obj.offsetTop + speed;if(T > document.documentElement.clientHeight - obj.offsetHeight) {T = document.documentElement.clientHeight - obj.offsetHeight;speed *= -1;speed *= 0.75;speedX *= .75;}if(Math.abs(speed) <= 2 && Math.abs(T - (document.documentElement.clientHeight - obj.offsetHeight)) <= 1) {clearInterval(obj.timer);}obj.style.top = T + 'px';obj.style.left = obj.offsetLeft + speedX + 'px';//                        console.log(obj.offsetLeft);}, 30);
}

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><link rel="stylesheet" type="text/css" href="../css/public.css"/><style type="text/css">#div1{width: 100px;height: 100px;background: red;position: absolute;top: 30px;left: 0;}</style><script type="text/javascript" src="../js/rainbow.js"></script><script type="text/javascript">window.onload=function(){var oDiv=document.getElementById("div1");var oBtn=document.getElementById("btn");oBtn.onclick=function(){fallMove(oDiv);}}</script></head><body><input type="button" name="btn" id="btn" value="自由落体" /><div id="div1"></div></body>
</html>

转载于:https://www.cnblogs.com/rain92/p/6107502.html

自由落体和抛物线运动相关推荐

2021-06-23 自由落体运动,抛物线运动和缓冲运动的实现
目录思路自由落体运动抛物线运动缓冲运动代码 html: css: js: 效果思路自由落体运动 1.小球落下:设置绝对定位,定时器中改变其top值 2.运动停止:设置目标值,达到目标值时 ...
C++入门——仿真小球自由落体运动和抛物线运动
参考 <C和C++游戏趣味编程> 童真仿真自由落体的小球实现小球受重力影响加速下落后,碰到地面反弹的效果代码如下: #include <graphics.h> #incl ...
第2章自由落体的小球（《C和C++游戏趣味编程》配套教学视频）
(图书介绍:https://blog.csdn.net/weixin_49630241/article/details/113548064) 这一章我们将实现小球受重力影响加速下落,碰到地面后反弹的效 ...
模拟自由落体运动的小球
基于VS2019 EasyX插件 C/C++ 生成一个模拟自由落体运动的小球 #include <iostream> #include <graphics.h> #in ...
pygame里面物体闪烁运动_教师资格【试讲示范】高中物理试讲答辩——《自由落体运动》试讲稿答辩...
试讲备课纸教学过程各位考官: 大家好,我是高中物理组的***号考生,我试讲的题目是<自由落体运动>,下面开始我的试讲. 一.导入新课同学们,老师手里现在拿着一个小笔记本和一张纸,现在 ...
Silverlight2 边学边练之三小球自由落体
终于看到动画章节了,本篇主要针对物体移动.变形和渐变移动进行练习. 完成小球自由落体慢镜实例,请大家多多拍砖,废话少说快快操练. XAML Code: <UserControl x:Class= ...
Android实现简单的检测手机自由落体关闭屏幕
实现功能如下:在背景运行app,检测到自由落体状态时,熄灭屏幕,可重复测试. 1. 检测自由落体动作需要使用到加速度感应器 TYPE_ACCELEROMETER SensorManager mSen ...
html和css如何制作小球,[网页设计]使用CSS3动画模拟实现小球自由落体效果
[网页设计]使用CSS3动画模拟实现小球自由落体效果 0 2015-07-20 14:00:03 使用纯CSS代码模拟实现小球自由落体效果: html代码如下:1 2 CSS样式代码:/*ball样式 ...
手把手教你用Python来模拟绘制自由落体运动过程中的抛物线（附源码）
前言前几天有个叫[-berry]的粉丝在问了一道关于自由落体运动过程中产生的抛物线作图的问题,如下图所示. 当某个物体以初速度v水平抛出,其轨迹为一条抛物线,模拟绘制这条抛物线.用高中物理知识,我们 ...

自由落体和抛物线运动

自由落体和抛物线运动相关推荐

最新文章

热门文章