您的位置：首页 > Web前端 > JavaScript

js(javascript)不间断循环图片

2009-05-26 15:03 260 查看

转载

方法一：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<STYLE type=text/css>BODY {
MARGIN-TOP: 0px; MARGIN-BOTTOM: 0px
}
</STYLE>

<META content="MSHTML 6.00.2900.2963" name=GENERATOR></HEAD>
<BODY>
<DIV id=demo
style="BACKGROUND: #ffffff; OVERFLOW: hidden; WIDTH: 100%; COLOR: #ffffff; HEIGHT: 85px">
<TABLE cellSpacing=0 cellPadding=0 align=left border=0>
<TBODY>
<TR height=85>
<TD id=demo10 vAlign=top><IMG height=3 src="logo.files/jxmemory.htm"
width=0 border=0><BR><NOBR>
<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#cccccc cellSpacing=0
cellPadding=4 width="100%" align=center border=0>
<TBODY>
<TR>
<TD width="100%">
<TABLE cellSpacing=0 cellPadding=0 width=1300 border=0>
<TBODY>
<TR>
<TD align=middle colSpan=13> </TD></TR>
<TR>
<TD align=middle width=100><IMG height=14
src="logo.files/acer.gif" width=45></TD>
<TD align=middle width=100><IMG height=24
src="logo.files/apple.jpg" width=24></TD>
<TD align=middle width=100><IMG height=22
src="logo.files/cisco.jpg" width=49></TD>
<TD align=middle width=100><IMG height=15
src="logo.files/compaq.jpg" width=76></TD>
<TD align=middle width=100><IMG height=17
src="logo.files/dell.jpg" width=54></TD>
<TD align=middle width=100><IMG height=24
src="logo.files/fujitsu.gif" width=44></TD>
<TD align=middle width=100><IMG height=18
src="logo.files/hp.jpg" width=28></TD>
<TD align=middle width=100><IMG height=16
src="logo.files/ibm.jpg" width=43></TD>
<TD align=middle width=100><IMG height=24
src="logo.files/intel.gif" width=48></TD>
<TD align=middle width=100><IMG height=18
src="logo.files/sharp.gif" width=78></TD>
<TD align=middle width=100><IMG height=23
src="logo.files/sony.jpg" width=50></TD>
<TD align=middle width=100><IMG height=22
src="logo.files/sun.jpg" width=50></TD>
<TD align=middle width=100><IMG height=12
src="logo.files/toshiba.jpg" width=65></TD></TR>
<TR>
<TD align=middle
colSpan=13> </TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></NOBR></TD>
<TD id=demo20 vAlign=top></TD></TR></TBODY></TABLE></DIV>
<SCRIPT>
var speed=30
demo20.innerHTML=demo10.innerHTML
function Marquee1(){

if(demo20.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo10.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar1=setInterval(Marquee1,speed)
demo.onmouseover=function() {clearInterval(MyMar1)}
demo.onmouseout=function() {MyMar1=setInterval(Marquee1,speed)}
</SCRIPT>
</BODY></HTML>

方法二：

<DIV id=demo style="OVERFLOW: hidden; WIDTH: 980px; HEIGHT: 87px"
align=center>
<TABLE cellSpacing=0 cellPadding=0 align=left border=0
cellspace="0">
<TBODY>
<TR>
<TD id=demo1 vAlign=top><table width="1100" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="120"><img src="images/gundong/1.jpg" width="120" height="87"></td>
<td width="10"> </td>
<td width="120"><img src="images/gundong/2.jpg" width="120" height="87"></td>
<td width="10"> </td>
<td width="120"><img src="images/gundong/3.jpg" width="120" height="87"></td>
<td width="10"> </td>
<td width="120"><img src="images/gundong/3.jpg" width="120" height="87"></td>
<td width="10"> </td>
<td width="120"><img src="images/gundong/3.jpg" width="120" height="87"></td>
<td width="10"> </td>
<td width="120"><img src="images/gundong/3.jpg" width="120" height="87"></td>
<td width="10"> </td>
<td width="120"><img src="images/gundong/3.jpg" width="120" height="87"></td>
<td width="10"> </td>
<td width="120"><img src="images/gundong/3.jpg" width="120" height="87"></td>

</tr>
</table></TD>
<TD id=demo2 vAlign=top></TD></TR></TBODY></TABLE></DIV>
<SCRIPT>
var speed=30
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>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航