JavaScript若干问题

最近在公司做WEB页面的动效,横向的无线刷新,可以理解为把微博的下拉刷新,修改为右拉(ps:我自己起的名字)刷新,

原理来说很简单,就是判断你现在滑动的元素的滑动值(scroll)和你父元素差值,例如下拉刷新,是scrollTop 和 window.height 之间的关系,然后看你觉得何时加载何时,就用这个差值,一般是body.height加一个小的差值,说说我做的横向刷新。


因为是横向,而且是内部元素,所以判断的地方要改动,首先是变scroll的元素,不是window,而是你需要滑动的元素。判断条件也变了,变成滑动的元素和父元素之间的关系。因为 监听的是滑动的scrollLeft,和父元素的width之间的差值。其他都一样。


上面的完成之后,还是会有问题的,因为当你判断的差值如果稍稍大点,那么会连续触发这个刷新加载事件,于是我手动的加上一个unbind操作,把scroll的监听加载去掉,那么就会加载,滑条会弹到中间某一个值。然后再加载完后,又绑定上整个事件,这样子循环就会无限刷新下去。


今天解决的另外一个问题和css3 有关。也就是translation,这个css3 加上的属性,它可以让你的元素平滑度过css属性的各种变化,例如 height width background的等等,其可以相当于执行了现在jquery的animate函数一样,但是性能消耗更少,也更简单,不过要求是元素的css属性要有变化才行(当然你不能删除这个属性),这样子才能触发动画。


问题在于 低版本的IE(真想弄死这个浏览器)不支持这个属性,所以你需要做个判断,判断cssTranslation的支持情况,如果不支持,你就需要自己写一个函数来完成动画,推荐 $.animate 效果不错。


代码之类的过几天贴上来。