[Js]缓冲运动
一、运动框架
1.在开始运动时,关闭已有定时器(否则会不断有新的定时器执行)
2.把运动和停止隔开(if/else)
二、缓冲运动
逐渐变慢,最后停止(距离越远速度越大)
速度=(目标值-当前值)/缩放系数
例如 var iSpeed=(iTarget-oDiv.offsetLeft)/8;
但由于除法可能产生小数,位置加上一个小数还是会被舍弃(如300.25px其实还是会被计算机当成300px),所以小数要给它向上取整,当然也有可能是负的小数,那就要向下取整
iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed);
潜在问题:目标值有时候也是计算出来可能是小数,也要给它取整parseInt(iTarget)
三、匀速运动的停止条件
距离足够近
if(Math.abs(oDiv.offsetLeft-iTarget)<iSpeed){ //不管往左还是往右,取绝对值
oDiv.style.left=iTarget+'px';
}
[Js]缓冲运动的更多相关文章
- JS缓冲运动案例:右侧居中悬浮窗
JS缓冲运动案例:右侧居中悬浮窗 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta cha ...
- JS缓冲运动案例:右下角悬浮窗
JS缓冲运动案例:右下角悬浮窗 红色区块模拟页面的右下角浮窗,在页面进行滚动时,浮窗做缓冲运动,最终在页面右下角停留. <!DOCTYPE html> <html lang=&quo ...
- js缓冲运动
缓冲运动 现象:逐渐变慢,最后停止 原理:距离越远,速度越大 速度的计算方式: 1,速度由距离决定 2,速度=(目标值-当前值)/缩放系数 说明:速度为正负数时,也决定了物体移动的方向 示例:div缓 ...
- JS缓冲运动案例
点击"向右"按钮,红色的#red区块开始向右缓冲运动,抵达到黑色竖线位置自动停止,再次点击"向右"#red区块也不会再运动.点击"向左"按钮 ...
- JS 缓冲运动 带运动的留言本 小案例
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
- js 运动函数篇 (一) (匀速运动、缓冲运动、多物体运动、多物体不同值运动、多物体多值运动)层层深入
前言: 本人纯小白一个,有很多地方理解的没有各位大牛那么透彻,如有错误,请各位大牛指出斧正!小弟感激不尽. 本篇文章为您分析一下原生JS写 匀速运动.缓冲运动.多物体运 ...
- js实现缓冲运动,和匀速运动有点不相同
缓冲运动和匀速运动有点不同,看图可以知道缓冲运动速度是越来越慢的. <style> *{ padding:0; margin:10px 0; } #div1{ height:100px; ...
- js动画之缓冲运动
缓冲运动就是运动的速度与时间或者距离有关联,不是一般的匀速运动 <!DOCTYPE html> <html lang="en"> <head> ...
- JS运动基础(二) 摩擦运动、缓冲运动
摩擦运动: 逐渐变慢,最后停止 缓冲运动: 与摩擦力的区别:可以精确的停到指定目标点距离越远速度越大速度由距离决定速度=(目标值-当前值)/缩放系数Bug:速度取整值取整: iSpeed = iSpe ...
随机推荐
- Java List实体类去重
版权声明:本文为博主原创文章,未经博主允许不得转载. List特点:元素有放入顺序,元素可重复 Map特点:元素按键值对存储,无放入顺序 Set特点:元素无放入顺序,元素不可重复(注意:元素虽然无放入 ...
- Spring3 表达式语言(SpEL)介绍
转载自:http://iyiguo.net/blog/2011/06/19/spring-expression-language/ 下一版本 项目需要使用到SpEL ,做一个保存.
- 为什么要使用Hibernate
因为! a paradigm mismatch between how data is represented in objects versus relational databases ! 对象数 ...
- 合并Excel文件
//合并Excel文件 private void MargeExcelFile(string destFile, string dirPath) { DirectoryInfo dir = new D ...
- VIm vi 使用 汇总
x 删除当前光标下的字符dw 删除光标之后的单词剩余部分.d$ 删除光标之后的该行剩余部分.dd 删除当前行. c 功能和d相同,区别在于完成删除操作后进入INSERT MODEcc 也是删除当前行, ...
- vitamio 缓冲一部分时,loading还没消失,直接点击播放,loading未能消失
在videoView的start()中 添加loading消失语句,效果很好 ,也没有出现任何问题
- 使用分布式数据库集群做大数据分析之OneProxy
一.十亿数据,轻松秒出 实时监控领域有两个显著的特点,一是数据来源很多而且数据量大,有来自监控摄像头.GPS.智能设备等:二是需要实时处理.我们的客户在做实时处理时,就遇到这样的问题.客户的某个数据表 ...
- 20145218 《Java程序设计》第五周学习总结
20145218 <Java程序设计>第五周学习总结 教材学习内容总结 异常 程序中总有些意想不到的状况所引发的错误,如果不对异常进行正确的处理,则可能导致程序的中断执行,造成不必要的损失 ...
- js和jquery获取子元素
<ul id="nav"> <li></li> <li> <ul> <li></li> < ...
- Qt之QLineEdit
简述 QLineEdit是一个单行文本输入框. QLineEdit允许用户输入和编辑单行纯文本,提供了很多有用的编辑功能,包括:撤消和重做.剪切和粘贴.以及拖放(见setDragEnabled()). ...