图片向上滚动代码（三款)

文章收集了三款图片向上滚动代码哦，他们都是利用了来实例图片向上滚动效果哦，下面一款款来看看吧，其实一款是用marquee实现的，还有就是利用了js来实例了。
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>图片向上滚动代码（三款)</title>
</head>

<body>

<table cellspacing=0 cellpadding=0 width=598 align=center border=0>
<tbody>
<tr>
<td valign=center align=middle>
<script language=网页特效>
<!--
var scrollerwidth=597
var scrollerheight=100
var scrollerbgcolor='white'

var pausebetweenimages=1000

var slideimages=new array()
slideimages[0]='<a href=/esite/dhllama/default1.asp教程x target=_blank><img border=0 height=100 src="/article/uploadfiles/200911/20091114132801715.gif" width=597></a>'
slideimages[1]='<a href=/membermncenter/busiinfo_detail.aspx?eproid=546 target=_blank><img border=0 height=100 src=/article/uploadfiles/200911/20091114132802485.jpg width=597></a>'
slideimages[2]='<a href=/membermncenter/busiinfo_detail.aspx?eproid=433 target=_blank><img border=0 height=100 src=/article/uploadfiles/200911/20091114132802677.jpg width=597></a>'
slideimages[3]='<a href=/membermncenter/busiinfo_detail.aspx?eproid=112 target=_blank><img border=0 height=100 src=/article/uploadfiles/200911/20091114132803261.jpg width=597></a>'
slideimages[4]='<a href=/membermncenter/busiinfo_detail.aspx?eproid=115 target=_blank><img border=0 height=100 src=/article/uploadfiles/200911/20091114132803769.jpg width=597></a>'
slideimages[5]='<a href=/membermncenter/busiinfo_detail.aspx?eproid=545 target=_blank><img border=0 height=100 src=/article/uploadfiles/200911/20091114132803441.jpg width=597></a>'
slideimages[6]='<a href=/membermncenter/busiinfo_detail.aspx?eproid=383 target=_blank><img border=0 height=100 src=/article/uploadfiles/200911/20091114132803513.jpg width=597></a>'
slideimages[7]='<a href=/membermncenter/busiinfo_detail.aspx?eproid=357 target=_blank><img border=0 height=100 src=/article/uploadfiles/200911/20091114132803407.jpg width=597></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>
<ilayer id=main bgcolor="&{scrollerbgcolor};"
height="&{scrollerheight};" width="&{scrollerwidth};"><layer
id=first width="&{scrollerwidth};" top="1" left="0">
<script language=javascript1.2>
if (document.layers)
document.write(slideimages[0])
</script>
</layer><layer id=second width="&{scrollerwidth};" top="0"
left="0" visibility="hide">
<script language=javascript1.2>
if (document.layers)
document.write(slideimages[1])
</script>
</layer></ilayer>
<p>
<script language=javascript>

</script>
</p></td></tr></tbody></table>

</marquee>

<div id=demo style=overflow:hidden;height:410;width:150;color:#fbf9f4>
                <div id=demo1> <a href="#"><img src=图片 width="150" border="0"></a><br>
                    <a href="#"><img src=图片 width="150" border="0"></a><br>
                    <a href="#"><img src=图片 width="150" border="0"></a><br>
                    <a href="#"><img src=图片 width="150" border="0"></a><br>
                    <a href="#"><img src=图片 width="150" border="0"></a><br>
                    <a href="#"><img src=图片 width="150" border="0"></a><br>
                    <a href="#"><img src=图片 width="150" border="0"></a><br>
                    <a href="#"><img src=图片 width="150" border="0"></a><br>
                </div>
                <div id=demo2></div>
              </div>
                <script>
   var speed=20
   demo2.innerhtml=demo1.innerhtml
   function marquee3(){
   if(demo2.offsettop-demo.scrolltop<=0)
   demo.scrolltop-=demo1.offsetheight
   else{
   demo.scrolltop++
   }
   }
   var mymar=setinterval(marquee3,speed)
   demo.onmouseo教程ver=function() {clearinterval(mymar)}
demo.onmouseout=function() {mymar=setinterval(marquee3,speed)}
          </script>
</body>
</html>

补充：网页制作,js教程