JavaScript String 小球重力弹回
JavaScript String 小球重力弹回
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
.box{
width: 50px;
height: 50px;
border-radius: 50%;
background:purple;
position: absolute;
top: 0;
left: 0;
}
.line{
width: 500px;
border: 1px solid #333;
position: absolute;
top: 450px;
left: 0;
}
</style>
</head>
<body>
<div class="box"></div>
<div class="line"></div>
</body>
<script type="text/javascript">
var obox=document.querySelector(".box"); var speed=5;//计步器
var target=400;//下落高度
document.onclick=function(){
setInterval(function(){
speed+=10;
var now=obox.offsetTop+speed;
if(now>=target){
now=target;
speed*=-1;//当小球到达底部停止，使他方向相反运动
speed*=0.9;//使小球有一定的速度
}
obox.style.top=now+"px";
},30)
}
</script>
</html>
JavaScript String 小球重力弹回的更多相关文章
- 弹性ScrollView,和下啦刷新的效果类似 实现下拉弹回和上拉弹回
今天做了一个弹性ScrollView,和下啦刷新的效果类似,我想这个很多需求都用的这种效果 其实这是一个自定义的scrollView,上代码,这是我写在一个公共的组件包里的 package com.p ...
- 弹性ScrollView,和下啦刷新的效果相似 实现下拉弹回和上拉弹回
今天做了一个弹性ScrollView,和下啦刷新的效果类似,我想这个非常多需求都用的这样的效果 事实上这是一个自己定义的scrollView,上代码.这是我写在一个公共的组件包里的 package c ...
- 充满想象力的 JavaScript 物理和重力实验
在这个列表中挑选了9个物理和重力实验,用来展示 Javascript 的强大.几年前,所有这些实验都必须使用 Java 或 Flash 才能做.在下面这些惊人的例子中,就个人而言,我比较喜欢仿真布料的 ...
- JavaScript String 对象
JavaScript String 对象 String 对象 String 对象用于处理文本(字符串). String 对象创建方法: new String(). 语法 var txt = new S ...
- javascript string 函数集
JavaScript_String对象说明 string中文为"字符串"的意思,String继承自Object对象,此对象提供字符串的查找操作等函数 JavaScript字符串类型 ...
- 一款jQuery实现重力弹动模拟效果特效,弹弹弹，弹走IE6
一款jQuery实现重力弹动模拟效果特效 鼠标经过两块黑色div中间的红色线时,下方的黑快会突然掉落, 并在掉落地上那一刻出现了弹跳的jquery特效效果,非常不错,还兼容所有的浏览器, 适用浏览器: ...
- 第一百三十三节，JavaScript，封装库--弹出登录框
JavaScript,封装库--弹出登录框 封装库,增加了两个方法 yuan_su_ju_zhong()方法,将获取到的区块元素居中到页面,chuang_kou_shi_jian()方法,浏览器窗口事 ...
- 【timeisprecious】【JavaScript 】JavaScript String 对象
JavaScript>String 对象 1 .From Runnob JavaScript String 对象(概览) JavaScript String 对象(教程)
- JavaScript 实现简单的 弹出框关闭框
JavaScript 实现简单的 弹出框关闭框 知识点: 1.javaScript 添加HTML标签 2.javaScript 添加HTML标签属性 3.javaScript 追加元素 代码献上: & ...
随机推荐
- python课堂整理20----生产者消费者模型
一.实现功能:店铺生产包子,消费者来吃 import time def producter(): ret = [] for i in range(10): time.sleep(0.1) ret.ap ...
- backtracing
5月10日 1 37 Sudoku Slover public void solveSudoku(char[][] board) { if(board == null || board.length ...
- 11. Java常用类
1. Scanner类 1.1 基本语法 java.util.Scanner 是 Java5 的新特征,我们可以通过 Scanner 类来获取用户的输入. Scanner s = new Scanne ...
- 彻底搞懂Python切片操作
在利用Python解决各种实际问题的过程中,经常会遇到从某个对象中抽取部分值的情况,切片操作正是专门用于完成这一操作的有力武器.理论上而言,只要条件表达式得当,可以通过单次或多次切片操作实现任 ...
- Shell基本语法---shell的变量以及常见符号
变量 1. 不同于其它语言需要先声明变量 2 .等号的两边不能有空格 3. 调用变量: $a 或者 ${a} a=; echo $a; echo ${a} 变量 变量意思 $? 判断上一条命令执行的 ...
- Django安装 测试、导入项目以及运行开发服务器
安装Django 下载Django包,解压缩. CMD 进入解压路径下. 执行:python setup.py install 增加环境变量: C:\Python27\Scripts 测试djang ...
- iOS 注释
1) 参数的注释: UIButton *btnSend;/**< 发送按钮 */ 效果: 2) 方法的注释: type1(无参数): /** table 相关设置 */ -(void)confi ...
- K8S 部署 Web UI
在早期的版本中 Kubernetes可以在 Dashboard 中看到 heapster 提供的一些图表信息, 在后续的版本中会陆续移除掉 heapster,现在更加流行的监控工具是 promethe ...
- .NET Core 3.0深入源码理解HttpClientFactory之实战
写在前面 前面两篇文章透过源码角度,理解了HttpClientFactory的内部实现,当我们在项目中使用时,总会涉及以下几个问题: HttpClient超时处理以及重试机制 HttpClient ...
- 03、Swagger2和Springmvc整合详细记录（爬坑记录）
时间 内容 备注 2018年6月18日 基本使用 spirngmvc整合swagger2 开始之前这个系列博文基本是,在项目的使用中一些模块的内容记录,但是后期逐渐优化,不单单是整合内容. swagg ...