js 滚动的图片

 

<script language="javascript">

imgArr=new Array()

imgArr[0]="<a href=http://www.wawaqin.com/ onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://www.wawaqin.com/images/wawaqin_logo.gif border=0></a>"

imgArr[1]="<a href=http://www.wawaqin.com/ onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://www.wawaqin.com/images/wawaqin_logo.gif border=0></a>"

imgArr[2]="<a href=http://www.wawaqin.com/ onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://www.wawaqin.com/images/wawaqin_logo.gif border=0></a>"

imgArr[3]="<a href=http://www.wawaqin.com/ onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://www.wawaqin.com/images/wawaqin_logo.gif border=0></a>"

imgArr[4]="<a href=http://www.wawaqin.com/ onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://www.wawaqin.com/images/wawaqin_logo.gif border=0></a>"

var moveStep=4        //步长,单位:pixel

var moveRelax=100    //移动时间间隔,单位:ms

ns4=(document.layers)?true:false

var displayImgAmount=4    //视区窗口可显示个数

var divWidth=220    //每块图片占位宽

var divHeight=145    //每块图片占位高

var startDnum=0

var nextDnum=startDnum+displayImgAmount

var timeID

var outHover=false

var startDivClipLeft

var nextDivClipRight

function initDivPlace(){

    if (ns4){

        for (i=0;i<displayImgAmount;i++){

            eval("document.divOuter.document.divAds"+i+".left="+divWidth*i)

        }

        for (i=displayImgAmount;i<imgArr.length;i++){

            eval("document.divOuter.document.divAds"+i+".left="+divWidth*displayImgAmount)

        }

    }else{

        for (i=0;i<displayImgAmount;i++){

            eval("document.all.divAds"+i+".style.left="+divWidth*i)

        }

        for (i=displayImgAmount;i<imgArr.length;i++){

            eval("document.all.divAds"+i+".style.left="+divWidth*displayImgAmount)

        }

    }

}

function mvStart(){

    timeID=setTimeout(moveLeftDiv,moveRelax)

}

function mvStop(){

    clearTimeout(timeID)

}

function moveLeftDiv(){

    if (ns4){

        for (i=0;i<=displayImgAmount;i++){

            eval("document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left=document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left-moveStep")

        }

        startDivClipLeft=parseInt(eval("document.divOuter.document.divAds"+startDnum+".clip.left"))

        nextDivClipRight=parseInt(eval("document.divOuter.document.divAds"+nextDnum+".clip.right"))

        if (startDivClipLeft+moveStep>divWidth){

            eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+divWidth)

           

            eval("document.divOuter.document.divAds"+startDnum+".left="+divWidth*displayImgAmount)

            eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".left=document.divOuter.document.divAds"+nextDnum+".left+"+divWidth)

            eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".clip.left=0")

           

            

            startDnum=(++startDnum)%imgArr.length

            nextDnum=(startDnum+displayImgAmount)%imgArr.length

           

            startDivClipLeft=moveStep-(divWidth-startDivClipLeft)

            nextDivClipRight=moveStep-(divWidth-nextDivClipRight)

        }else{

            eval("document.divOuter.document.divAds"+nextDnum+".clip.left=0")

            startDivClipLeft+=moveStep

            nextDivClipRight+=moveStep

        }

        eval("document.divOuter.document.divAds"+startDnum+".clip.left="+startDivClipLeft)

        eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+nextDivClipRight)

    }else{

        for (i=0;i<=displayImgAmount;i++){

            eval("document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.left=document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.pixelLeft-moveStep")

        }

   

        startDivClipLeft=parseInt(eval("document.all.divAds"+startDnum+".currentStyle.clipLeft"))

        nextDivClipRight=parseInt(eval("document.all.divAds"+nextDnum+".currentStyle.clipRight"))

   

        if (startDivClipLeft+moveStep>divWidth){

            eval("document.all.divAds"+nextDnum+".style.clip='rect(0,"+divWidth+","+divHeight+",0"+")'")

           

            eval("document.all.divAds"+startDnum+".style.left="+divWidth*displayImgAmount)

            eval("document.all.divAds"+parseInt((nextDnum+1)%imgArr.length)+".style.left=document.all.divAds"+nextDnum+".style.pixelLeft+"+divWidth)

           

            startDnum=(++startDnum)%imgArr.length

            nextDnum=(startDnum+displayImgAmount)%imgArr.length

           

            startDivClipLeft=moveStep-(divWidth-startDivClipLeft)

            nextDivClipRight=moveStep-(divWidth-nextDivClipRight)

        }else{

            startDivClipLeft+=moveStep

            nextDivClipRight+=moveStep

        }

        eval("document.all.divAds"+startDnum+".style.clip='rect(0,"+divWidth+","+divHeight+","+startDivClipLeft+")'")

        eval("document.all.divAds"+nextDnum+".style.clip='rect(0,"+nextDivClipRight+","+divHeight+",0)'")

    }

    if (outHover){

        mvStop()

    }else{

        mvStart()

    }

}

function writeDivs(){

    if (ns4){

        document.write("<ilayer name=divOuter width=750 height="+divHeight+">")

       

        for (i=0;i<imgArr.length;i++){

            document.write("<layer name=divAds"+i+">")

            document.write(imgArr[i]+" ")

            document.write("</layer>")

        }

        document.write("</ilayer>")

        document.close()

        for (i=displayImgAmount;i<imgArr.length;i++){

            eval("document.divOuter.document.divAds"+i+".clip.right=0")

        }

    }else{

        document.write("<div id=divOuter style='position:relative' width=750 height="+divHeight+">")

       

        for (i=0;i<imgArr.length;i++){

            document.write("<div id=divAds"+i+" style='position:absolute;clip:rect(0,"+divWidth+","+divHeight+",0)'>")

            document.write(imgArr[i]+" ")

            document.write("</div>")

        }

        document.write("</div>")

        for (i=displayImgAmount;i<imgArr.length;i++){

            eval("document.all.divAds"+i+".style.clip='rect(0,0,"+divHeight+",0)'")

        }

    }

}

</script>

<BODY οnlοad=javascript:mvStart()>

<SCRIPT language=javascript>writeDivs();initDivPlace();</SCRIPT>

posted @ 2010-09-12 00:27  骑猪上高速_D  阅读(55)  评论(0编辑  收藏  举报