变速改变任意对象的任意属性大小的动画函数:
![]()
1 //变速改变任意对象的任意属性大小的函数
2 animation_variableSpeed: function (ele, ele_tar, func_callback) { //ele 对象 attr 属性名字 targetPos 目标位置 func_callbk回调函数
3 var that = this;
4 var len = Object.getOwnPropertyNames(ele_tar).length; //它是获取ele_tar对象中 有多少个字段。
5 //清理定时器
6 clearInterval(ele.timeId);
7 ele.timeId = setInterval(function () {
8 for (var key in ele_tar) {
9 var attr = key;
10 var targetPos = ele_tar[key];
11
12 if (attr == "opacity") { //透明度属性
13 //此时的 透明度的精度设计是 0.01
14 var curPos = parseInt( ele.opacity * 100); //透明度放大100倍方便计算(此时类型是数字类型)
15 var targetPos = parseInt(ele_tar[attr] * 100); //目标透明度也放大100倍
16
17 var step = (targetPos - curPos) / 10;
18 step = step > 0 ? Math.ceil(step) : Math.floor(step);
19 curPos += step;
20
21 ele[attr] = curPos / 100; //最后赋值的时候也要缩小100倍
22 console.log("cur: " + curPos + " tar:" + targetPos + " step:" + step + " ");
23
24 } else if (attr == "zIndex") { //层次的属性
25 ele[attr] = ele_tar[attr];
26
27 } else { //普通的属性
28 //获取当前的位置
29 var curPos = parseInt(ele[attr]);
30 //每次移动的步数
31 var step = (targetPos - curPos) / 10;
32 step = targetPos > curPos ? Math.ceil(step) : Math.floor(step); //正数向上取整 负数向下取整
33 curPos += step;
34 ele[attr] = curPos;
35 console.log("cur: " + curPos + " tar:" + targetPos + " step:" + step + " ");
36 }
37
38
39 var flag = true; // 清理定时器
40 for (var key in ele_tar) {
41 var attr = key;
42 if( ele[attr] != ele_tar[attr] ){
43 flag = false;
44 }
45 }
46 if(flag){
47 console.log("清理定时器")
48 clearInterval(ele.timeId);
49 //所有的属性都更改完毕之后再调用回调函数!
50 if (func_callback) { //有 callbk 才可以调用
51 func_callback();
52 }
53 }
54 }
55 that.setData({ele:ele});
56 }, 15);
57 }
变速动画函数