百度评分


onmouseout时清除，利用cur变量循环，利用onclick来设置cur，如果cur小于0，则不设置，一旦onclick设置了cur值，即发生点击，则out时保持onclick状态
百度评分原理

文字上飘


防止重复点击：

if(obj.b) { return; }
obj.b = !0;
...

中间开始依次两边走原理

5 4 6 3 7 2 8 1 9 0 10

//方案一：
以首个5个基点：
即 num2 = -1 +2 -3 +4 -5 +6....  //中间协助得到下面数的变量；
再利用5，依次相加
num = 5 4 6 3 7 ...//实际要用到的数；

文字上飘


图片点击左右飘走


利用transition
图片点击左右飘走

图片同步与交叉走


图片同步与交叉走

商品价格计算


主要分清作用域名，上面部分在一个循环里，下面则需要整个div查找元素来确定，写在sum()里，确保每次事件都可调用到；
商品价格计算

奇偶选择

Math.floor( i / 8 ) ，则 1-8列里，得到的都为0
Math.floor( i / 8 ) ，则 9-15列里，得到的都为1

i%2 == 0 则为偶数
i%2 == 1 则为奇数

奇偶选择


图片无缝切换原理


<quoteblock>

【】表示当前显示，两张图片需要2个变量 ；<br />
1、页面上总显示2张图片； 【1】 - 1<br />
2、点击--> 瞬间第2张图片地址切换-->整个div向左运动-400   1 - 【2】<br />
3、再次点击--> 时,改变图片地址 2 - 3，瞬间重置div为left:0,这是直接拉回，视觉看不出，最后再次做运动 2 - 【3】<br />
4、所以div总在 -400与0之间<br />
5、连续点击闪动，运动未解决禁止重复点击<br />

</quoteblock>
图片无缝切换原理




图片抖动掉落

    function getArr(index) { //index即为左边的个数
        var arr = []
        arr[0] = index;
        var len = Math.max(index, img.length - 1 - index);//左右两边最大的
        var a = b = index;
        for (var i = 0; i < len; i++) {
            if (a > 0) {
                a--;
                arr.push(a)
            }
            if (b < img.length - 1) {
                b++
                arr.push(b)
            }
        }
        return arr;
    }

//如console.dir(getArr(5))  === >  5 4 6 3 7 2 8 1 9 0

图片掉落

for套for矩形排列

// 5 x 5
    var str = ''
    for (var i = 0; i < 5; i++) {
        for (var j = 0; j < 5; j++) {
            str += '<...top:' + i % 5 * 90 ;left:' + j * 90 .../>'
        }
    }

先抖动再掉落时，按顺序依次落下须使用回调函数外一个变量，内一个变量，否则出问题
图片抖动掉落



多组菜单自动播放


原理：两个变量，控制父级变量inow,控制子级变量num，关系为：1:0,1:1,1:2.....

2:0,2:1,2:2.....等，分别控制，切换为，当num到达最大值是切换到第二级的条件是num = ..length, if里切换inow的值为0,1,2,3.....

多组菜单自动播放