滚动的图片代码

向左滚动:

<base href=" http://www.flash8.net">
<div id=demo style=overflow:hidden;height:33;width:500;background:#214984;color:#ffffff><table align=left cellpadding=0 cellspace=0 border=0><tr><td id=demo1 valign=top><img src="images/link/flashempire.gif"><img src="images/linklogo/shlogo.gif"><img src="images/link/deskcity.gif"><img src="images/linklogo/5dmeng.gif"><img src="/Upload/2004_Pack/logo.gif"><img src="images/link/flashskylogo.gif"><img src="images/link/5dlogo88.gif"><img src="/Upload/2004_Pack/link.gif"><img src="images/flash8.gif"></td><td id=demo2 valign=top></td></tr></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.οnmοuseοver=function() {clearInterval(MyMar)}
demo.οnmοuseοut=function() {MyMar=setInterval(Marquee,speed)}
</script>
你这个问题属于图片无缝滚动问题,还有向下滚动,向右滚动,向上滚动

向上滚动的代码:

<base href=" http://www.flash8.net">
<div id=demo style=overflow:hidden;height:100;width:90;background:#214984;color:#ffffff><div id=demo1>
<img src="images/flash8.gif">
<img src="images/link/flashempire.gif">
<img src="images/linklogo/shlogo.gif">
<img src="images/link/deskcity.gif">
<img src="images/linklogo/5dmeng.gif">
<img src="/Upload/2004_Pack/logo.gif">
<img src="images/link/flashskylogo.gif">
<img src="images/link/5dlogo88.gif">
<img src="/Upload/2004_Pack/link.gif">
</div>
<div id=demo2></div>
</div>
<script>
var speed=30
demo2.innerHTML=demo1.innerHTML file://克隆demo1为demo2
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0) file://当滚动至demo1与demo2交界时
demo.scrollTop-=demo1.offsetHeight file://demo跳到最顶端
else{
demo.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed) file://设置定时器
demo.οnmοuseοver=function() {clearInterval(MyMar)}//鼠标移上时清除定时器达到滚动停止的目的
demo.οnmοuseοut=function() {MyMar=setInterval(Marquee,speed)}//鼠标移开时重设定时器
</script>


向下滚动:

<base href=" http://www.flash8.net">
<div id=demo style=overflow:hidden;height:100;width:90;background:#214984;color:#ffffff><div id=demo1>
<img src="images/flash8.gif">
<img src="images/link/flashempire.gif">
<img src="images/linklogo/shlogo.gif">
<img src="images/link/deskcity.gif">
<img src="images/linklogo/5dmeng.gif">
<img src="/Upload/2004_Pack/logo.gif">
<img src="images/link/flashskylogo.gif">
<img src="images/link/5dlogo88.gif">
<img src="/Upload/2004_Pack/link.gif">
</div>
<div id=demo2></div>
</div>
<script>
var speed=30
demo2.innerHTML=demo1.innerHTML
demo.scrollTop=demo.scrollHeight
function Marquee(){
if(demo1.offsetTop-demo.scrollTop>=0)
demo.scrollTop+=demo2.offsetHeight
else{
demo.scrollTop--
}
}
var MyMar=setInterval(Marquee,speed)
demo.οnmοuseοver=function() {clearInterval(MyMar)}
demo.οnmοuseοut=function() {MyMar=setInterval(Marquee,speed)}
</script>


向右滚动:

<base href=" http://www.flash8.net">
<div id=demo style=overflow:hidden;height:33;width:500;background:#214984;color:#ffffff><table align=left cellpadding=0 cellspace=0 border=0><tr><td id=demo1 valign=top><img src="images/link/flashempire.gif"><img src="images/linklogo/shlogo.gif"><img src="images/link/deskcity.gif"><img src="images/linklogo/5dmeng.gif"><img src="/Upload/2004_Pack/logo.gif"><img src="images/link/flashskylogo.gif"><img src="images/link/5dlogo88.gif"><img src="/Upload/2004_Pack/link.gif"><img src="images/flash8.gif"></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.οnmοuseοver=function() {clearInterval(MyMar)}
demo.οnmοuseοut=function() {MyMar=setInterval(Marquee,speed)}
</script>


层的宽度不能大于图片显示的整体宽度。 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值