多图片展示及运动框架总结

1、运动框架演变过程

startMove(iTarget)    运动框架之单物体

startMove(obj,iTarget)   多物体同时为每一个obj增加了自定义属性timer

startMove(obj,attr,iTarget)  任意值之单个

startMove(obj,attr,iTarget,fn) 链式运动之单个值链式运动

startMove(obj,json)  任意值之多个同时运动

startMove(obj,json，fn) 完美运动框架 

2、relative没有脱离文档流

absolute脱离了文档流，不占位置，元素之间不受影响

3、位置布局有2种方式可以实现，1种是在CSS中通过浮动方便实现，另一种是在JS中通过绝对定位方便实现

4、布局转换：文档流定位->绝对定位

5、人的出场顺序很重要，代码君也如此

 for(i=0;i<aLi.length;i++){
                    aLi[i].style.left=aLi[i].offsetLeft+'px';
                    aLi[i].style.top=aLi[i].offsetTop+'px';
                }
 for(i=0;i<aLi.length;i++) {
                aLi[i].style.position='absolute';
                aLi[i].style.margin=0;
            }

6、不用担心数量，不用担心自适应问题

<style>
        #ul1{width:366px;margin:0 auto;}
        #ul1 li{list-style:none;float:left;width:100px;height:100px;background:#CCCCCC;
                border:1px solid #000000;margin:10px;}
    </style>

7、margin周围没有其他元素时，是相对自身，margin负值用途多多