微信标志

JAVAscript练习

东山群-电脑网络技术
1、缓冲运动与匀速运动的对比



红线为距离500PX的标杆,点击方块可以复位。

速度/距离
0/0
2、浮动层



记录

缓冲运动:当物体与终点的距离大的时候,速度越大,反之越小。速度和距离是成正比的。

距离越远速度越大:速度由距离决定,速度=(目标值-当前值)/系数。例如:
(iTarget-this.offsetLeft)/10

速度取整:但凡是用到缓冲运动,都必须取整。例如
speed=speed>0?Math.ceil(speed):Math.floor(speed);

缓冲浮动层:建立一个运动函数,设置目标的参数iTarget为滚动距离scrollTop+document.documentElement.clientHeight-当前层.offsetHeight,速度为(iTarget-当前层.offsetTop)/系数。当offsetTop等于itarget时停止计时器,否则让当前层的top以速度自增。

目标点取整:例如当浮动层处于中间位置当时候必须要除以二,所以有可能出现.5而抖动,这时候就必须用paseInt进行目标点取整。

匀速运动的停止条件:当速度不足以跑足目标点时,就需要用Math.abs来取剩余数当绝对值,同时用它判断是否小于等于speed。如果小于,就停止定时器,并直接把它设置到目标点的值。

浮动层