JS 图片按序排列效果

PS：JS中用到的库是我开发的悦淘街的库，由于特殊原因此demo必须放到悦淘街页面下才可访问，大家可以使用其他类库替换，只是提供一个思路。运动函数可以看（JS手风琴特效、运动函数）这里的

<ul id="ulNode">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
    <li>7</li>
    <li>8</li>
    <li>9</li>
    <li>10</li>
    <li>11</li>
    <li>12</li>
    <li>13</li>
    <li>14</li>
</ul>
<button id="btn">click</button>
<script type="text/javascript">
    Dom.Ready(function(){
        var ulNode = Y.$("#ulNode"),liNodes = Y.getTagName(ulNode,"li"),len = liNodes.length;
        var row = Math.floor(len/3);
        var btnNode = Y.$("#btn"),con = null,num=0,j=0,v=0;
        btnNode.onclick = function(){
            con = setInterval(function(){
                j= Math.ceil((num+1)/row);
                moveTo(num,j);
                num++;
                if (num>=(len)) {
                    clearInterval(con);
                };
            },100);
        };
        function moveTo(n,j){
            var leftP = (n%row)*50;
            v = j-1;
            Y.startMove(liNodes[n],{
                left:leftP,
                top:v*50
            });
        };
    });
</script>

转载于:https://www.cnblogs.com/starweb/archive/2012/10/30/2746789.html