圖片滾動顯示，每次圖片指向連接都不同，作為友情連接非常實用

- 中國WEB開發者網絡 (http://www.webasp.net)
-- 網頁特效 (http://www.webasp.net/javascript/)
--- 圖片滾動顯示，每次圖片指向連接都不同，作為友情連接非常實用 (http://www.webasp.net/javascript/1/268.htm)
-- 發佈日期： 2004-07-13
<!-- 網頁特效代碼由[中國WEB開發者網絡:http://www.ChinaWebDev.com]提供！ -->
<!-- 要實現此效果需要 2 個步驟： -->

<!-- 第 1 步： -->
<!-- 把下面的代碼加到<HEAD></HEAD>區域中： -->

<SCRIPT language="JavaScript">

<!--

var scrollerwidth=88

var scrollerheight=31

var scrollerbgcolor='white'

//每個圖間暫停3秒。

var pausebetweenimages=3000





//邊界下面的行，如果希望logo都是帶連接的，只要加上<a>標籤即可。

var slideimages=new Array()

slideimages[0]='<A href=http://www.webasp.net target=_blank><IMG alt=中國WEB開發者網絡 border=0 height=31 src=http://www.webasp.net/images/logos.gif width=88></A>'
slideimages[1]='<A href=http://www.webasp.net target=_blank><IMG alt=中國WEB開發者網絡 border=0 height=31 src=http://www.webasp.net/images/logos.gif width=88></A>'
slideimages[2]='<A href=http://www.webasp.net target=_blank><IMG alt=中國WEB開發者網絡 border=0 height=31 src=http://www.webasp.net/images/logos.gif width=88></A>'
slideimages[3]='<A href=http://www.webasp.net target=_blank><IMG alt=中國WEB開發者網絡 border=0 height=31 src=http://www.webasp.net/images/logos.gif width=88></A>'
slideimages[4]='<A href=http://www.webasp.net target=_blank><IMG alt=中國WEB開發者網絡 border=0 height=31 src=http://www.webasp.net/images/logos.gif width=88></A>'


//儘管填加更多的。





if (slideimages.length>1)

i=2

else

i=0



function move1(whichlayer){

tlayer=eval(whichlayer)

if (tlayer.top>0&&tlayer.top<=5){

tlayer.top=0

setTimeout("move1(tlayer)",pausebetweenimages)

setTimeout("move2(document.main.document.second)",pausebetweenimages)

return

}

if (tlayer.top>=tlayer.document.height*-1){

tlayer.top-=5

setTimeout("move1(tlayer)",100)

}

else{

tlayer.top=scrollerheight

tlayer.document.write(slideimages[i])

tlayer.document.close()

if (i==slideimages.length-1)

i=0

else

i++

}

}



function move2(whichlayer){

tlayer2=eval(whichlayer)

if (tlayer2.top>0&&tlayer2.top<=5){

tlayer2.top=0

setTimeout("move2(tlayer2)",pausebetweenimages)

setTimeout("move1(document.main.document.first)",pausebetweenimages)

return

}

if (tlayer2.top>=tlayer2.document.height*-1){

tlayer2.top-=5

setTimeout("move2(tlayer2)",100)

}

else{

tlayer2.top=scrollerheight

tlayer2.document.write(slideimages[i])

tlayer2.document.close()

if (i==slideimages.length-1)

i=0

else

i++

}

}



function move3(whichdiv){

tdiv=eval(whichdiv)

if (tdiv.style.pixelTop>0&&tdiv.style.pixelTop<=5){

tdiv.style.pixelTop=0

setTimeout("move3(tdiv)",pausebetweenimages)

setTimeout("move4(second2)",pausebetweenimages)

return

}

if (tdiv.style.pixelTop>=tdiv.offsetHeight*-1){

tdiv.style.pixelTop-=5

setTimeout("move3(tdiv)",100)

}

else{

tdiv.style.pixelTop=scrollerheight

tdiv.innerHTML=slideimages[i]

if (i==slideimages.length-1)

i=0

else

i++

}

}



function move4(whichdiv){

tdiv2=eval(whichdiv)

if (tdiv2.style.pixelTop>0&&tdiv2.style.pixelTop<=5){

tdiv2.style.pixelTop=0

setTimeout("move4(tdiv2)",pausebetweenimages)

setTimeout("move3(first2)",pausebetweenimages)

return

}

if (tdiv2.style.pixelTop>=tdiv2.offsetHeight*-1){

tdiv2.style.pixelTop-=5

setTimeout("move4(second2)",100)

}

else{

tdiv2.style.pixelTop=scrollerheight

tdiv2.innerHTML=slideimages[i]

if (i==slideimages.length-1)

i=0

else

i++

}

}



function startscroll(){

if (document.all){

move3(first2)

second2.style.top=scrollerheight

}

else if (document.layers){

move1(document.main.document.first)

document.main.document.second.top=scrollerheight+5

document.main.document.second.visibility='show'

}

}



window.onload=startscroll





//-->





</SCRIPT>




<!-- 第 2 步： -->
<!-- 把下面的代碼加到<BODY></BODY>區域中： -->

<ilayer id="main" width=&{scrollerwidth}; height=&{scrollerheight}; bgcolor=&{scrollerbgcolor};>

<layer id="first" left=0 top=1 width=&{scrollerwidth};>

<script language="JavaScript1.2">

if (document.layers)

document.write(slideimages[0])

</script>

</layer>

<layer id="second" left=0 top=0 width=&{scrollerwidth}; visibility=hide>

<script language="JavaScript1.2">

if (document.layers)

document.write(slideimages[1])

</script>

</layer>

</ilayer>

<p>

<SCRIPT language="JavaScript">

<!--

if (document.all){

document.writeln('<span id="main2" style="position:relative;width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hiden;background-color:'+scrollerbgcolor+'">')

document.writeln('<div style="position:absolute;width:'+scrollerwidth+';height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0;top:0">')

document.writeln('<div id="first2" style="position:absolute;width:'+scrollerwidth+';left:0;top:1;">')

document.write(slideimages[0])

document.writeln('</div>')

document.writeln('<div id="second2" style="position:absolute;width:'+scrollerwidth+';left:0;top:0">')

document.write(slideimages[1])

document.writeln('</div>')

document.writeln('</div>')

document.writeln('</span>')

}

//-->





</SCRIPT>

webasp.net