 |
|
| 来源：夏日博客 发布时间：2013-01-15 22:16:27 |
|
今天给一个客户做网站，要求左右不间断滚动的，用Marquee 标签做出来的效果会留白，显得不是很美观。从互联网上搜集了一段不错的js控制的图片左右不间断滚动代码，可以用来做美化用。
1,滚动的内容页面，可以用文字也可以用图片等网页信息内容
<TABLE cellSpacing=0 cellPadding=0 width=97% align=center border=0>
<TBODY>
<TR>
<TD align="center">
<DIV id=demo style="OVERFLOW: hidden; WIDTH: 97%; COLOR: #ffffff">
<TABLE cellSpacing=0 cellPadding=0 align=left border=0 cellspace="0">
<TBODY>
<TR>
<TD id=demo1 vAlign=top><table width="97%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><img src="images/gd01.jpg"></td>
<td><img src="images/gd02.jpg"></td>
<td><img src="images/gd03.jpg"></td>
<td><img src="images/gd04.jpg"></td>
<td><img src="images/gd05.jpg"></td>
<td><img src="images/gd06.jpg"></td>
<td><img src="images/gd07.jpg"></td>
<td><img src="images/gd08.jpg"></td>
<td><img src="images/gd09.jpg"></td>
<td><img src="/template/fengyun/images/gd10.jpg"></td>
</tr>
</table></TD>
<TD id=demo2 vAlign=top> </TD></TR></TBODY></TABLE></DIV>
<script language=Javascript src="js/scrollpic.js"></script> </TD></TR></TBODY></TABLE>
2，调用的js特效代码
var speed3=25//速度数值越大速度越慢
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)} |
|
|
|
| Powered By 夏日博客 CopyRight 2012- 2014, 夏日博客 xhtml | css
Processed in 0.781250 second(s) , 4 queries 版本:PHP生成静态页面小程序 v1.1 |
|