重拾Javascript(三) 缓存运动

示例1:从左向右的加快运动

窗体从左向右加快移动

image image image

代码:

注:此处主要是运行速度的计算

技巧:进行速度向上或向下取整

原因:屏幕的最小单位是1px,在计算速度最后得到位置有可能会得到291.8px这样的值,故在此处进行向上或向下的取整

        利用Javascript的Math.ceil进行向上和Math.floor进行向下

image

示例2:保持窗体在页面右下角 进行滚动进行缓存运行

image

代码:【此处主要是计算窗口的TOP值】

计算方法:

image

image

示例3:微博列表,添加微博先进行高度拉伸,然后进行透明度加强

本示例未用JQUERY进行制作,思路是一样的

添加LI元素 将LI的元素高度高度记录下来进行保留 将LI的元素高度变成0 然后通过动画的效果进行将LI高度变成原来高度

效果:

image

 

代码:

image

posted @ 2013-06-04 19:59  zhu_xj  阅读(132)  评论(0)    收藏  举报