圖片滾動代碼
<div id=demo
style=overflow:hidden;height:150;width:90;background:#214984;color:#ffffff>
<div id=demo1>
圖片在這里
</div>
<div id=demo2></div>
</div>
<script>
var speed=30
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight
else{
demo.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
///////////////////////////////////////////////////////////////////
有什么问题请到<a href='/bbs/forums.php?fid=21'>论坛</a>中发表<br>
<!-- http://www.webjx.com/ -->
<!-- bbs http://www.webjx.com/bbs-->
<!-- 把下列代码加到<body>区域内 -->
<SCRIPT>
// more javascript from http://www.webjx.com
// URLs of slides
var slideurl=new Array
("/img/200406301.jpg","/img/200406302.jpg","/img/200406303.jpg","/img/20040
6304.jpg")
// comments displayed below the slides
var slidecomment=new Array("Mary","Jane","Rita","Tina")
// links for each slide
var slidelink=new Array
("http://www.webjx.com","http://www.webjx.com","http://www.webjx.com","http
://www.webjx.com")
// targets of the links. Allowed values: "_parent", "_top", "_blank",
"_self"
var slidetarget=new Array("_blank","_blank","_blank","_blank")
// the width of the slideshow (pixels)
var scrollerwidth=160
// the height of the slideshow (pixels)
var scrollerheight=100
// width of the transparent zones (pixels)
var translayerszone=40
// font-attributes for the comments
var slidefont="Arial"
var slidefontcolor="blue"
var slidefontsize="2"
// background-color of webpage
var pagebgcolor="#FFFFFF"
// do not edit below this line
var translayerswidth=1
var translayersmax=Math.floor(translayerszone/translayerswidth)
var translayersleftpos=0
var translayersopacity=100
var translayersfactor=100/translayersmax
var translayerswidthall=translayersmax*translayerswidth
var allpicturewidth
var distancepictopic=0
var scrollerleft=0
var scrollertop=0
var pause=20
var step=2
var newstep=step
var clipleft,clipright,cliptop,clipbottom
var i_picture=0
var timer
var picturecontent=""
var ns4=document.layers?1:0
var ns6=document.getElementById&&!document.all?1:0
var ie=document.all?1:0
var browserinfos=navigator.userAgent
var opera=browserinfos.match(/Opera/)
var preloadedimages=new Array()
for (i=0;i<slideurl.length;i++){
preloadedimages[i]=new Image()
preloadedimages[i].src=slideurl[i]
}
function init() {
if (ie) {
allpicturewidth=document.all.picturediv.offsetWidth
document.all.picturediv.style.posTop=scrollertop
document.all.picturediv.style.posLeft=scrollerleft+scrollerwidth
clipleft=0
clipright=0
cliptop=0
clipbottom=scrollerheight
document.all.picturediv.style.clip ="rect("+cliptop+"
"+clipright+" "+clipbottom+" "+clipleft+")"
document.all.picturediv.style.visibility="visible"
scrollpicture()
}
if (ns6) {
allpicturewidth=document.getElementById
('emptypicturediv').offsetWidth
document.getElementById('picturediv').style.top=scrollertop
document.getElementById
('picturediv').style.left=scrollerleft+scrollerwidth
clipleft=0
clipright=0
cliptop=0
clipbottom=scrollerheight
document.getElementById('picturediv').style.clip ="rect
("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
document.getElementById
('picturediv').style.visibility="visible"
scrollpicture()
}
if (ns4) {
allpicturewidth=document.roof.document.picturediv.document.width
document.roof.document.picturediv.top=scrollertop
document.roof.document.picturediv.left=scrollerleft+scrollerwidth
document.roof.document.picturediv.clip.left=0
document.roof.document.picturediv.clip.right=0
document.roof.document.picturediv.clip.top=0
document.roof.document.picturediv.clip.bottom=scrollerheight
document.roof.document.picturediv.visibility="visible"
scrollpicture()
}
}
function scrollpicture() {
if (ie) {
if (document.all.picturediv.style.posLeft>=scrollerleft-
allpicturewidth) {
document.all.picturediv.style.posLeft-=step
clipright+=step
if (clipright>scrollerwidth) {
clipleft+=step
}
document.all.picturediv.style.clip ="rect
("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
var timer=setTimeout("scrollpicture()",pause)
}
else {
resetposition()
}
}
if (ns6) {
if (parseInt(document.getElementById
('picturediv').style.left)>=scrollerleft-allpicturewidth) {
document.getElementById('picturediv').style.left=parseInt
(document.getElementById('picturediv').style.left)-step
clipright+=step
if (clipright>scrollerwidth) {
clipleft+=step
}
document.getElementById('picturediv').style.clip
="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
var timer=setTimeout("scrollpicture()",pause)
}
else {
resetposition()
}
}
if (ns4) {
if (document.roof.document.picturediv.left>=scrollerleft-
allpicturewidth) {
document.roof.document.picturediv.left-=step
document.roof.document.picturediv.clip.right+=step
if
(document.roof.document.picturediv.clip.right>scrollerwidth) {
document.roof.document.picturediv.clip.left+=step
}
var timer=setTimeout("scrollpicture()",pause)
}
else {
resetposition()
}
}
}
function onmsover() {
step=0
}
function onmsout() {
step=newstep
}
function resetposition() {
if (ie) {
document.all.picturediv.style.posLeft=scrollerleft+scrollerwidth
clipleft=0
clipright=0
document.all.picturediv.style.clip ="rect("+cliptop+"
"+clipright+" "+clipbottom+" "+clipleft+")"
scrollpicture()
}
if (ns6) {
allpicturewidth=document.getElementById
('emptypicturediv').offsetWidth
document.getElementById
('picturediv').style.left=scrollerleft+scrollerwidth
clipleft=0
clipright=0
document.getElementById('picturediv').style.clip ="rect
("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
scrollpicture()
}
if (ns4) {
document.roof.document.picturediv.left=scrollerleft+scrollerwidth
document.roof.document.picturediv.clip.left=0
document.roof.document.picturediv.clip.right=0
scrollpicture()
}
}
picturecontent=""
picturecontent+="<table cellpadding=2 cellspacing=0>"
picturecontent+="<tr>"
for (i=0;i<=slideurl.length-1;i++) {
picturecontent+="<td>"
picturecontent+="<a href=\""+slidelink[i]+"\"
target=\""+slidetarget[i]+"\" onMouseOver=\"javascript:onmsover()\"
onMouseOut=\"javascript:onmsout()\">"
picturecontent+="<img src=\""+slideurl[i]+"\" border=0></a>"
picturecontent+="</td>"
}
picturecontent+="</tr>"
picturecontent+="<tr>"
for (i=0;i<=slideurl.length-1;i++) {
picturecontent+="<td>"
picturecontent+="<font face=\""+slidefont+"\"
color=\""+slidefontcolor+"\" size="+slidefontsize+">"
picturecontent+=slidecomment[i]
picturecontent+="</font>"
picturecontent+="</td>"
}
picturecontent+="</tr>"
picturecontent+="</tr></table>"
if (ie || ns6) {
document.write('<div
style="position:relative;width:'+scrollerwidth+'px;height:'+scrollerheight+
'px;overflow:hidden">')
document.write('<div id="picturediv"
style="position:absolute;top:0px;left:0px;height:'+scrollerheight+'px;visib
ility:hidden">'+picturecontent+'</div>')
if (ie && !opera) {
for (i=0;i<=translayersmax;i++) {
document.write('<span ID="trans'+i+'"
style="position:absolute;top:0px;left:'+translayersleftpos+'px;width:'+tran
slayerswidth+'px;height:'+scrollerheight+'px;background-
color:'+pagebgcolor+';filter:alpha
(opacity='+translayersopacity+');overflow:hidden"> </span>')
translayersleftpos+=translayerswidth
translayersopacity-=translayersfactor
}
translayersleftpos=scrollerwidth-translayersleftpos
for (ii=0;ii<=translayersmax;ii++) {
document.write('<span ID="trans'+ii+'"
style="position:absolute;top:0px;left:'+translayersleftpos+'px;width:'+tran
slayerswidth+'px;height:'+scrollerheight+'px;background-
color:'+pagebgcolor+';filter:alpha
(opacity='+translayersopacity+');overflow:hidden"> </span>')
translayersleftpos+=translayerswidth
translayersopacity+=translayersfactor
}
}
if (ns6 && !opera) {
for (i=0;i<=translayersmax-1;i++) {
document.write('<span ID="transleft'+i+'"
style="position:absolute;top:0px;left:'+translayersleftpos+'px;width:'+tran
slayerswidth+'px;height:'+scrollerheight+'px;background-
color:'+pagebgcolor+';-moz-
opacity:'+translayersopacity/100+';overflow:hidden"> </span>')
translayersleftpos+=translayerswidth
translayersopacity-=translayersfactor
if (translayersopacity<0) {translayersopacity=0.001}
}
translayersleftpos=scrollerwidth-translayersleftpos
translayersopacity=0.001
for (i=0;i<=translayersmax-1;i++) {
document.write('<span ID="transright'+i+'"
style="position:absolute;top:0px;left:'+translayersleftpos+'px;width:'+tran
slayerswidth+'px;height:'+scrollerheight+'px;background-
color:'+pagebgcolor+';-moz-opacity:'+translayersopacity/100+';"> </span>')
translayersleftpos+=translayerswidth
translayersopacity+=translayersfactor
}
}
document.write('</div>')
document.write('<div id="emptypicturediv"
style="position:absolute;top:0px;left:0px;height:'+scrollerheight+'px;visib
ility:hidden">'+picturecontent+'</div>')
window.onload=init
}
if (ns4) {
document.write('<ilayer name="roof" width='+scrollerwidth+'
height='+scrollerheight+'>')
document.write('<layer name="picturediv" width='+scrollerwidth+'
height='+scrollerheight+' visibility=hide>'+picturecontent+'</layer>')
document.write('</ilayer>')
window.onload=init
}
</script>
////////////////////////////////////////////////////////////////////////
感谢彩云南 萌芽邪恶 coolbeela提供的原帖。
http://bbs.powereasy.net/dispbbs.asp?BoardID=47&ID=130934
一、向左滚动
1、调用“图片”栏目图片的向左滚动代码 (效果演示)
以下是最新图片标签说明。
以下是首页模板最新图片部分代码
以下是引用片段:
-----------------------------------
〈tr〉
〈td class=main_title_575〉〈B〉最新图片〈/B〉〈/td〉
〈/tr〉
〈tr〉
〈td class=main_tdbg_575 valign=middle align=center height=131〉
〈!--{$GetPicPhoto(3,0,True,0,4,False,False,0,1,1,130,90,20,0,True,4)}--
〉 〈/td〉
〈/tr〉
------------------------------------
用以下是滚动代码代替上面红色的标签部分,注意红色部分的变化。
------------------------------------
〈!--滚动代码开始--〉
〈div id=demo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px"〉
〈table cellPadding=0 align=left border=0 cellspace="0"〉
〈tr〉
〈td id=demo11 vAlign=top〉
〈!--{$GetPicPhoto
(3,0,True,0,12,False,False,0,1,1,130,90,20,0,True,12)}--〉〈/td〉
〈td id=demo12 vAlign=top〉〈/td〉
〈/tr〉
〈/table〉
〈/div〉
〈SCRIPT〉
var speed=15
demo12.innerHTML=demo11.innerHTML
function Marquee11(){
if(demo12.offsetWidth-demo.scrollLeft〈=0)
demo.scrollLeft-=demo11.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar1=setInterval(Marquee11,speed)
demo.onmouseover=function() {clearInterval(MyMar1)}
demo.onmouseout=function() {MyMar1=setInterval(Marquee11,speed)}
〈/SCRIPT〉
〈!--滚动代码结束--〉
-----------------------------------
2、文章频道图片向左滚动代码 (效果演示)
以下是文章频道模板最新图片部分代码
-----------------------------------
〈tr〉
〈td Class="main_title_575"〉〈b〉最新图片{$ChannelShortName}〈/b〉〈/td
〉
〈/tr〉
〈tr〉
〈td Class="main_tdbg_575"〉 {$GetPicArticle
(ChannelID,0,True,0,4,false,false,0,3,2,130,90,20,0,True,4)} 〈/td〉
〈/tr〉
〈tr〉
〈td Class="main_shadow"〉〈/td〉
〈/tr〉
------------------------------------
用以下是滚动代码代替上面红色的标签,注意红色部分的变化。红色数字代表了滚动
图片的总数(这里为8张)。
----------------------------------
〈!--滚动代码开始--〉
〈div id=demo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px"〉
〈table cellPadding=0 align=left border=0 cellspace="0"〉
〈tr〉
〈td id=demo11 vAlign=top〉
〈!--{$GetPicArticle
(ChannelID,0,True,0,8,false,false,0,3,2,130,90,20,0,True,8)}--〉〈/td〉
〈td id=demo12 vAlign=top〉〈/td〉
〈/tr〉
〈/table〉
〈/div〉
〈SCRIPT〉
var speed=15
demo12.innerHTML=demo11.innerHTML
function Marquee11(){
if(demo12.offsetWidth-demo.scrollLeft〈=0)
demo.scrollLeft-=demo11.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar1=setInterval(Marquee11,speed)
demo.onmouseover=function() {clearInterval(MyMar1)}
demo.onmouseout=function() {MyMar1=setInterval(Marquee11,speed)}
〈/SCRIPT〉
〈!--滚动代码结束--〉
-----------------------------------
3、下载频道图片向左滚动代码 (效果演示)
以下是下载频道模板推荐下载图片部分代码
-----------------------------------
〈tr〉
〈td Class="main_title_575"〉〈table width="100%" border="0"
cellspacing="0" cellpadding="0"〉
〈tr〉
〈td〉〈b〉〈a class=’Class’ href="{$InstallDir}
{$ChannelDir}/ShowElite.asp"〉推荐下载(图)〈/a〉〈/b〉〈/td〉
〈td align="right"〉{$RssElite}〈/td〉
〈/tr〉
〈/table〉〈/td〉
〈/tr〉
〈tr〉
〈td align="center" Class="main_tdbg_575"〉 {$GetPicSoft
(ChannelID,0,True,0,4,false,True,0,3,2,130,90,20,0,True,4)} 〈/td〉
〈/tr〉
------------------------------------
用以下是滚动代码代替上面红色的标签,注意红色部分的变化。红色数字代表了滚动
图片的总数(这里为12张)。
------------------------------------
〈!--滚动代码开始--〉
〈div id=demo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px"〉
〈table cellPadding=0 align=left border=0 cellspace="0"〉
〈tr〉
〈td id=demo11 vAlign=top〉
〈!--{$GetPicSoft
(ChannelID,0,True,0,12,false,True,0,3,2,130,90,20,0,True,12)}--〉〈/td〉
〈td id=demo12 vAlign=top〉〈/td〉
〈/tr〉
〈/table〉
〈/div〉
〈SCRIPT〉
var speed=15
demo12.innerHTML=demo11.innerHTML
function Marquee11(){
if(demo12.offsetWidth-demo.scrollLeft〈=0)
demo.scrollLeft-=demo11.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar1=setInterval(Marquee11,speed)
demo.onmouseover=function() {clearInterval(MyMar1)}
demo.onmouseout=function() {MyMar1=setInterval(Marquee11,speed)}
〈/SCRIPT〉
〈!--滚动代码结束--〉
------------------------------
从以上可以看出,滚动图片代码基本上是相同的,不同的是调用图片的标签变了。
------------------------------
二、向上滚动
向上滚动代码使用方法同上左滚动代码,这里只给出代码,不再说明。
以下是文章频道图片调用的滚动代码。
-----------------------------------------------------------
〈!--向上滚动代码开始--〉
〈DIV id=rolllink style="OVERFLOW: hidden; WIDTH: 160px; HEIGHT: 360px"〉
〈DIV id=rolllink1〉
〈TABLE cellSpacing=5 width="100%"〉
〈tr〉
〈td id=demo11 vAlign=top〉
〈!--{$GetPicArticle
(0,0,True,0,6,false,false,0,3,2,160,100,20,0,True,1)}--〉 〈/td〉
〈td id=demo12 vAlign=top〉〈/td〉
〈/tr〉
〈/TABLE〉
〈/DIV〉
〈DIV id=rolllink2〉〈/DIV〉
〈/DIV〉
〈SCRIPT〉
var rollspeed=40
rolllink2.innerHTML=rolllink1.innerHTML
function Marquee(){
if(rolllink2.offsetTop-rolllink.scrollTop〈=0)
rolllink.scrollTop-=rolllink1.offsetHeight
else{
rolllink.scrollTop++
}
}
var MyMar=setInterval(Marquee,rollspeed)
rolllink.onmouseover=function() {clearInterval(MyMar)}
rolllink.onmouseout=function() {MyMar=setInterval(Marquee,rollspeed)}
〈/SCRIPT〉
〈!--向上滚动代码结束--〉
-----------------------------------------------------------
以下是图片频道的3行4列向上滚动代码摘录: (效果演示)
………………………
〈tr〉
〈td colspan="3" Class="main_title_575"〉〈a class="Class"
href="{$InstallDir}{$ChannelDir}/ShowNew.asp"〉〈b〉最新{$ChannelShortName}
〈/b〉〈/a〉〈/td〉
〈/tr〉
〈tr valign="top"〉
〈td colspan="3"〉〈table width="100%" border="0"
cellspacing="0" cellpadding="0" Class="main_tdbg_575"〉
〈tr〉
〈td height="200" valign="top"〉
〈!--向上滚动代码开始--〉
〈DIV id=rolllink style="OVERFLOW: hidden; WIDTH: 575px; HEIGHT: 365px"〉
〈DIV id=rolllink1〉
〈TABLE cellSpacing=5 width="100%"〉
〈tr〉
〈td id=demo11 vAlign=top〉
〈!--{$GetPicPhoto
(ChannelID,0,True,0,24,False,False,0,1,1,130,90,20,0,True, 4)}--〉〈/td〉
〈td id=demo12 vAlign=top〉〈/td〉
〈/tr〉
〈/TABLE〉
〈/DIV〉
〈DIV id=rolllink2〉〈/DIV〉
〈/DIV〉
〈SCRIPT〉
var rollspeed=40
rolllink2.innerHTML=rolllink1.innerHTML
function Marquee(){
if(rolllink2.offsetTop-rolllink.scrollTop〈=0)
rolllink.scrollTop-=rolllink1.offsetHeight
else{
rolllink.scrollTop++
}
}
var MyMar=setInterval(Marquee,rollspeed)
rolllink.onmouseover=function() {clearInterval(MyMar)}
rolllink.onmouseout=function() {MyMar=setInterval(Marquee,rollspeed)}
〈/SCRIPT〉
〈!--向上滚动代码结束--〉
〈/td〉
〈/tr〉
〈/table〉
〈/td〉
〈/tr〉
〈tr〉
〈td colspan="3" Class="main_shadow"〉〈/td〉
〈/tr〉
…………………………
三、向右滚动
--------------------------------------
〈!--向右滚动代码开始--〉
〈div id=demo style=overflow:hidden;height:120;width:560;〉
〈table align=left cellpadding=0 cellspace=0 border=0〉
〈tr〉
〈td id=demo1 valign=top〉〈!--{$GetPicPhoto
(3,0,True,0,12,False,False,0,1,1,130,90,20,0,True,12)}--〉〈/td〉
〈td id=demo2 valign=top〉〈/td〉
〈/tr〉
〈/table〉
〈/div〉
〈script〉
var speed=30
demo2.innerHTML=demo1.innerHTML
demo.scrollLeft=demo.scrollWidth
function Marquee(){
if(demo.scrollLeft〈=0)
demo.scrollLeft+=demo2.offsetWidth
else{
demo.scrollLeft--
}
}
var MyMar=setInterval(Marquee, speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee, speed)}
〈/script〉
〈!--向右滚动代码结束--〉
-------------------------------------
注意滚动图片数不要太大,这会影响页面下载速度。
//////////////////////////////////////////////////////
<div id="demo" style="overflow:hidden;height:210;width:560;color:#ffffff">
<table align="left" cellpadding="0" cellspace="0"
border="0">
<tr>
<td id="demo1" valign="top"><table border="0"
cellpadding="0" cellspacing="0">
<tr>
<td><img src="indexgd/001.gif" width="143"
height="200" /></td>
<td><img src="indexgd/002.gif" width="143"
height="200" /></td>
<td><img src="indexgd/003.gif" width="143"
height="200" /></td>
<td><img src="indexgd/004.gif" width="143"
height="200" /></td>
<td><img src="indexgd/005.gif" width="143"
height="200" /></td>
<td><img src="indexgd/006.gif" width="143"
height="200" /></td>
<td><img src="indexgd/007.gif" width="143"
height="200" /></td>
<td><img src="indexgd/008.gif" width="143"
height="200" /></td>
</tr>
</table></td>
<td id="demo2" valign="top"></td>
</tr>
</table>
</div>
<script>
var speed=8//速度数值越大速度越慢
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
--------------------------------------------------------------------------
----------------------------------
[竖直的]
<DIV id=demo style="BACKGROUND: #ffffff; OVERFLOW: hidden; WIDTH: 150px;
COLOR: #0000ff; HEIGHT: 500px">
<DIV id=demo1>
<div align="center">
/<A href="http://www.google.com" target=_blank><IMG
src="http://127.0.0.1/UploadFiles/2005-12/20051211532359.jpg"
border=0></A><br>
<A href="http://www.google.com" target=_blank><IMG
src="http://127.0.0.1/UploadFiles/2005-11/2005113093040254.jpg"
border=0></A><br>
<A href="http://www.google.com" target=_blank><IMG
src="http://127.0.0.1/UploadFiles/2005-11/2005113093040254.jpg"
border=0></A><br>
</div>
</DIV>
<DIV id=demo2></DIV>
</DIV>
<SCRIPT language="javascript">
var speed=10;
demo2.innerHTML=demo1.innerHTML;
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0){
demo.scrollTop-=demo1.offsetHeight;
}
else{
demo.scrollTop++;
}
}
var MyMar=setInterval(Marquee,speed);
demo.onmouseover=function() {clearInterval(MyMar)};
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
</SCRIPT>
/////////////////////////////////////////////////////////////////////
<HTML><HEAD><TITLE>µL¼ÐÃD¤åÀÉ</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<META content="MSHTML 6.00.2800.1264" name=GENERATOR>
<link href="css/css.css" rel="stylesheet" type="text/css">
</HEAD>
<BODY leftMargin=0 topMargin=2 marginheight="0" marginwidth="0">
<CENTER>
<TABLE
style="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;
BORDER-LEFT: #666666 1px solid; BORDER-BOTTOM: #666666 1px solid"
cellSpacing=0 cellPadding=0 width=750 align=center border=0>
<TBODY>
<TR>
<TD>
<DIV id=demo style="OVERFLOW: hidden; WIDTH: 100%; COLOR: #ffffff">
<TABLE cellSpacing=0 cellPadding=0 align=left border=0 cellspace="0">
<TBODY>
<TR>
<TD id=demo1 vAlign=top><table width="1710" height="116"
border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="171" background="images/pic_bg.jpg"><div
align="center"> </div></td>
<td width="171" background="images/pic_bg.jpg"><div
align="center">¨¦</div></td>
<td width="171" background="images/pic_bg.jpg"><div
align="center">°Ê</div></td>
<td width="171" background="images/pic_bg.jpg"><div
align="center">¤O</div></td>
<td width="171" background="images/pic_bg.jpg"><div
align="center">¾Ç</div></td>
<td width="171" background="images/pic_bg.jpg"><div
align="center">°|</div></td>
<td width="171" background="images/pic_bg.jpg"><div
align="center">µø</div></td>
<td width="171" background="images/pic_bg.jpg"><div
align="center">ÀW</div></td>
<td width="171" background="images/pic_bg.jpg"><div
align="center">±Ð</div></td>
<td width="171" background="images/pic_bg.jpg"><div
align="center">µ{</div></td>
</tr>
</table></TD>
<TD id=demo2 vAlign=top> </TD></TR></TBODY></TABLE></DIV>
<SCRIPT>
var speed3=25//³t«×¼ÆȶV¤j³t«×¶VºC
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed3)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed3)}
</SCRIPT>
</TD></TR></TBODY></TABLE></TD></TR></TABLE>
</CENTER>
</BODY></HTML>
//////////////////////////////////////////////////////
http://www.google.com/search?q=%E5%9C%96%E7%89%87%E6%BB%BE%E5%8B%95%E4%BB%A3%E7%A2%BC&hl=zh-TW&newwindow=1&start=0&sa=N
/////////////
下面這個例子不錯
http://www.enet.com.cn/eschool/zhuanti/adpub/05/index.htm
申明
非源创博文中的内容均收集自网上,若有侵权之处,请及时联络,我会在第一时间内删除.再次说声抱歉!!!
博文欢迎转载,但请给出原文连接。