js运动 摩擦运动
<!DOCTYPE HTML>
<HTML>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<style>
*{
margin:0;
padding:0;
}
#div1{
height:100px;
width: 100px;
background: red;
position:absolute;
margin-left: 5px;
}
</style>
<script>
window.onload = function ()
{
var odiv = document.getElementById('div1');
var oinput = document.getElementsByTagName('input')[0]; oinput.onclick = function ()
{ ToMove(odiv,500,50);
} function ToMove(obj,goal,speed)
{
clearInterval(obj.timer);
obj.timer = setInterval(function(){
var icur = obj.offsetLeft;
if(icur >= goal)
{
clearInterval(obj.timer);
}
else
{
speed *= 0.9;
obj.style.left = obj.offsetLeft + speed + 'px';
}
},50);
}
}
</script>
<body>
<input type="button" value = "提交">
<div id="div1"></div>
</body>
</HTML>
js运动 摩擦运动的更多相关文章
- JS运动基础(二) 摩擦运动、缓冲运动
摩擦运动: 逐渐变慢,最后停止 缓冲运动: 与摩擦力的区别:可以精确的停到指定目标点距离越远速度越大速度由距离决定速度=(目标值-当前值)/缩放系数Bug:速度取整值取整: iSpeed = iSpe ...
- js动画 Css提供的运动 js提供的运动
1. 动画 (1) Css样式提供了运动 过渡的属性transition 从一种情况到另一种情况叫过渡 Transition:attr time linear delay: ...
- JS学习-基础运动
多物体运动 多个物体用同一个函数时,函数里定义的定时器应该要每个物体对应一个定时器名称,不然会导致未完成运动就被关闭了,因为定时器名称一样,而开启定时器前会清除一下. obj.timer 多值同时运动 ...
- JS实现缓存运动
JS ...
- js入门学习~ 运动应用小例
要实现的效果如下: 鼠标移入各个小方块,实现对应的效果(变宽,变高,移入透明,移出恢复)~~ (且各运动相互之前不干扰) 主要是练习多个物体的运动框架~~ --------------------- ...
- js实现缓冲运动,和匀速运动有点不相同
缓冲运动和匀速运动有点不同,看图可以知道缓冲运动速度是越来越慢的. <style> *{ padding:0; margin:10px 0; } #div1{ height:100px; ...
- JS之链式运动,及任意值运动框架,包括透明度的改变
链式运动,顾名思义,一环扣一环,即执行完一个事件后,再接着执行下一个事件,在参数上面动手脚,将下一个要执行的函数名作为一个参数,即利用到回掉函数,下面代码中出现的fn,即回掉函数, function ...
- js运动 多数据运动 含JSON
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- JS 之完美运动框架
完美运动框架是对原来的任意值运动框架的改善和效率的提升,即利用了json对属性进行封装,从而提高效率: window.onload=function(){ var oDiv=document.getE ...
随机推荐
- sqlserver取得本月一号
select convert(datetime,convert(varchar(7),getdate(),120)+'-01',120) select convert(datetime,convert ...
- Android Socket 聊天室示例
服务端: package com.test.chatServer; import java.io.IOException; import java.net.ServerSocket; import j ...
- BZOJ 1494 生成树计数(生成树计数-矩阵)
题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=1494 题意: 思路: int SIZE; struct matrix { i64 a[N] ...
- [HDOJ5583]Kingdom of Black and White(暴力)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5583 一个01串,求修改一个位置,使得所有数均为0或1的子串长度的平方和最大.先分块,然后统计好原来的 ...
- js之dom_1
DOM ie中有dom对象都是com对象的形式实现的 操作dom时,要注意返回的节点列表.属性列表都是动态的,会随着操作的改变而实时改变 document.getElementByI ...
- Xcode调试工具Instruments指南
主要途径是参考苹果官方文档,所以介绍以翻译官方文档为主.由于内容比较多,会分阶段来介绍. 以下来自苹果官方文档中对Instruments描述 介绍 Instruments是一个强大而灵活的性能分析和测 ...
- HDU 1517 (类巴什博奕) A Multiplication Game
如果n在[2, 9]区间,那么Stan胜. 如果n在[10, 18]区间,那么Ollie胜,因为不管第一次Stan乘上多少,第二次Ollie乘上一个9,必然会得到一个不小于18的数. 如果n在[19, ...
- Postgresql两表联结更新
Postgresql两表联合更新近日使用Postgresql感到有点不好用,一个联合更新非要这样写语法才对:update d_routetripset name=b.name , descrip ...
- PHP无法加载MySQL模块
在 将PHP根目录下libmysql.dll复制到c:\Windows\system32中 在Apache目录中的conf\httpd.conf 中加载libmysql.dll ...
- MVC+Ef项目(1) 项目的框架搭建
一:首先我们来搭建最基本的项目框架,这里使用MVC3作为web项目,然后我们添加几个类库项目 最后的项目如下, 其中有一个 YouJiao.MvcWeb.Repository 实际就当做是 DAL层即 ...