如何实现图片不间断的滚动啊？(页 1) - ASP技术论坛 - 编程论坛

dushui265 发表于 2007-10-21 14:24

如何实现图片不间断的滚动啊？

我想通过 Marquee 实现图片不间断的循环滚动，中间不会出现空白 有没有比较简单容易实现的代码啊？

zacom 发表于 2007-10-21 14:42

这个好象只能用ＪＳ来完成

天涯听雨 发表于 2007-10-21 16:43

参考代码： ———————————————————————————————————————— <style type="text/css">
.gradualshine{ filter:alpha(opacity=30); -moz-opacity:0.3; }
</style>
<script type="text/javascript"> var baseopacity=30
function slowhigh(which2){ imgobj=which2 browserdetect=which2.filters? "ie" : typeof which2.style.MozOpacity=="string"? "mozilla" : "" instantset(baseopacity) highlighting=setInterval("gradualfade(imgobj)",50) }
function slowlow(which2){ cleartimer() instantset(baseopacity) }
function instantset(degree){ if (browserdetect=="mozilla") imgobj.style.MozOpacity=degree/100 else if (browserdetect=="ie") imgobj.filters.alpha.opacity=degree }
function cleartimer(){ if (window.highlighting) clearInterval(highlighting) }
function gradualfade(cur2){ if (browserdetect=="mozilla" && cur2.style.MozOpacity<1) cur2.style.MozOpacity=Math.min(parseFloat(cur2.style.MozOpacity)+0.1, 0.99) else if (browserdetect=="ie" && cur2.filters.alpha.opacity<100) cur2.filters.alpha.opacity+=10 else if (window.highlighting) clearInterval(highlighting) }
</script> <DIV id=demo style="OVERFLOW: hidden; WIDTH:580px; HEIGHT:80px"> <TABLE cellSpacing=0 cellPadding=0 border=0> <TBODY> <TR> <TD id=demo1> <TABLE cellSpacing=0 cellPadding=3 > <TBODY> <TR vAlign=top align=left width="360"> <TD><IMG height=80 src="images/photo1.jpg" width=120 border=0></TD> <TD><IMG height=80 src="images/photo2.jpg" width=120 border=0></TD> <TD><IMG height=80 src="images/photo3.jpg" width=120 border=0></TD> <TD><IMG height=80 src="images/photo4.jpg" width=120 border=0></TD> <TD><IMG height=80 src="images/photo5.jpg" width=120 border=0></TD> <TD><IMG height=80 src="images/photo6.jpg" width=120 border=0></TD> <TD><IMG height=80 src="images/photo7.jpg" width=120 border=0></TD> <TD><IMG height=80 src="images/photo8.jpg" width=120 border=0></TD> <TD><IMG height=80 src="images/photo9.jpg" width=120 border=0></TD> <TD><IMG height=80 src="images/photo10.jpg" width=120 border=0></TD> </TR></TBODY></TABLE></TD> <TD id=demo2></TD></TR></TBODY> </TABLE> </DIV> <SCRIPT> var speed=20
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>

威龙嘉少 发表于 2007-10-21 18:13

怎么改变运行框的大小啊，还有就是点击察看大图怎么做呢？

madpbpl 发表于 2007-10-21 19:00

<DIV class=quote>以下是引用威龙嘉少在2007-10-21 18:13:30的发言： 怎么改变运行框的大小啊，还有就是点击察看大图怎么做呢？</DIV>
搜索lightbox

天涯听雨 发表于 2007-10-22 09:22

这些还在写出来……，真是要把所有的代码全部写好！[em03]

dushui265 发表于 2007-10-22 13:52

怎么发现把上面比较长的一段<script type="text/javascript">....</SCRIPT> 的代码去掉也会实现同样效果，没有影响啊？

chufanggang 发表于 2007-10-22 20:33

[em09]

cainiao158 发表于 2007-10-22 21:18

我在网上找的，大家借鉴一下吧！！！！ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "<a href="http://www.w3.org/TR/html4/loose.dtd" target="_blank" >http://www.w3.org/TR/html4/loose.dtd</A>"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>无标题文档</title> </head> <body> <div id="marquees">  <a href=""><img src=" " style="width:120px;height:120px;border:0px;" alt="test"/></a> <a href=""><img src=" " style="width:120px;height:120px;border:0px;" alt="test"/></a> <a href=""><img src=" " style="width:120px;height:120px;border:0px;" alt="test"/></a> <a href=""><img src=" " style="width:120px;height:120px;border:0px;" alt="test"/></a>  </div> 　　 　　<scrīpt language="javascrīpt"> 　　 　　</scrīpt> </body> </html>

zhangpei01 发表于 2008-6-26 18:04

试一试先!

[em01]

页: [1]

编程论坛's Archiver

如何实现图片不间断的滚动啊？

试一试先!