幾種js圖片之間切換的方法整理

1-幾個圖片在一個位置來回切換

<script language="JavaScript">
<span style="white-space:pre">	</span>var slidespeed=3000
        var slideimages=new Array("圖片地址","<span style="font-family: Arial, Helvetica, sans-serif;">圖片地址</span>","<span style="font-family: Arial, Helvetica, sans-serif;">圖片地址</span>")
        var slidelinks=new Array("/","/","/")
       <span style="white-space:pre">	</span>var imageholder=new Array()
       <span style="white-space:pre">	</span>var ie55=window.createPopup
        for (i=0;i<slideimages.length;i++){
         <span style="white-space:pre">	</span>imageholder[i]=new Image()
                imageholder[i].src=slideimages[i]
        }
<span style="white-space:pre">	</span>function gotoshow(){
                window.location=slidelinks[whichlink]
        }
</script>
<a href="javascript:gotoshow()">
<img src="圖片地址" name="slide" border="0" style="filter:progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=15,Duration=1)">
</a>
<script language="JavaScript">
<span style="white-space:pre">	</span>var whichlink=0
        var whichimage=0
        var pixeldelay=(ie55)? document.images.slide.filters[0].duration*1000 : 0
        function slideit(){
<span style="white-space:pre">		</span>if (!document.images) return
<span style="white-space:pre">		</span>if (ie55)
                <span style="white-space:pre">	</span>document.images.slide.filters[0].apply()
                <span style="white-space:pre">	</span>document.images.slide.src=imageholder[whichimage].src
              <span style="white-space:pre">	</span>if (ie55)
                <span style="white-space:pre">	</span>document.images.slide.filters[0].play()
                <span style="white-space:pre">	</span>whichlink=whichimage
                <span style="white-space:pre">	</span>whichimage=(whichimage<slideimages.length-1)? whichimage+1 : 0
               <span style="white-space:pre">		</span>setTimeout("slideit()",slidespeed+pixeldelay)
        }
        slideit()
</script>

2-幾張圖片從右到左循環移動

var sspeed=10
demog2.innerHTML=demog1.innerHTML
function Marquees(){
<span style="white-space:pre">	</span>if(demog2.offsetWidth-demog.scrollLeft<=0)
<span style="white-space:pre">		</span>demog.scrollLeft-=demog1.offsetWidth
 <span style="white-space:pre">	</span>else{
   <span style="white-space:pre">	</span>demog.scrollLeft++
    <span style="white-space:pre">	</span>}
   }
var MyMars=setInterval(Marquees,sspeed)
demog.οnmοuseοver=function() {clearInterval(MyMars)}
demog.οnmοuseοut=function() {MyMars=setInterval(Marquees,sspeed)}
兩組一樣的圖片

總的id=demog 兩組圖片分別是id=demog1 跟id=demog2

例如 

</pre><pre name="code" class="javascript"><div id=demog>
 <div id=demog1>
   圖片組
 </div>
 <div id=demog2>
   圖片組
 </div>
</div>



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章