javascriptスポーツフレーム

プログラムには輪播が必要で、しかもワイドスクリーン適応の輪播効果があります.
原生jsで実現するつもりです.
だから必ずjsの運動の枠組みを使います.それではまずこれを共有します.
 
以下はjsの運動フレームコードが現れます.(ネット上にはたくさんあります.)
パッケージされた動きフレームMove(obj、atr、iTarget)は、直接に起動できます.
width、border、fontSize、margingLeft、opacityなど多くの一般的な属性値の変速変化を設定するのに利用できます.様々な興味深い効果を実現します.
互換IEとFF

/****************
    *
    *   IE-BUG:
    *    IE ，  opacity   ，         opacity  ，     opacity 。
    *
    *   obj：    。   attr：         。   iTarget：     。
    *
    *****************/


    function Move(obj,attr,iTarget){
        clearInterval(obj.timer);//        ，             Move() ，       。  obj.timer     Move()           ，          Move() ，       ，         。
        obj.timer=setInterval(function(){
            var cur=0;//      ，     attr        
            if(attr=="opacity"){
            //   FF opacity          ，         、      。  100， opacity    IE      
                cur=Math.round(parseFloat(getStyle(obj,attr))*100);
            }else{
                cur=parseInt(getStyle(obj,attr));//  opacity    (width/fontSize/MarginLeft )          
            }
            var speed=(iTarget-cur)/10;//        speed  。          

            speed=speed>0?Math.ceil(speed):Math.floor(speed);//  ，         1px           ，    Itarget        

            if(iTarget==cur){//          ，     
                clearInterval(obj.timer);
            }else{
                    cur+=speed;//   cur          speed
                if(attr=="opacity"){
                    //    IE FF  opacity   
                    obj.style.filter="alpha(opacity:"+cur+")"; //for IE
                    obj.style.opacity=cur/100;   //for FF
                }else{
                    obj.style[attr]=cur+"px"; //     attr    cur+speed
                }
            }
        },30);
    }
    //getStyle()       IE FF：                  。 obj：    。 name：   。
    function getStyle(obj,name){
        if(obj.currentStyle){
            return obj.currentStyle[name];//for IE
        }else{
            return getComputedStyle(obj,false)[name];//for FF
        }
    }

 
次の1編がjsの輪播図の実現になることを期待しています.
類似:http://www.huawei.com/cn/
or https://www.alipay.com/?src=alipay.com 結合品