惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

量子位
Stack Overflow Blog
Stack Overflow Blog
人人都是产品经理
人人都是产品经理
The GitHub Blog
The GitHub Blog
Engineering at Meta
Engineering at Meta
Vercel News
Vercel News
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Y
Y Combinator Blog
The Cloudflare Blog
Last Week in AI
Last Week in AI
B
Blog
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
T
Tailwind CSS Blog
V
Visual Studio Blog
博客园 - 三生石上(FineUI控件)
小众软件
小众软件
Google DeepMind News
Google DeepMind News
D
DataBreaches.Net
博客园 - 司徒正美
B
Blog RSS Feed
Microsoft Azure Blog
Microsoft Azure Blog
罗磊的独立博客
Hugging Face - Blog
Hugging Face - Blog
L
LangChain Blog

博客园 - TomSun

sql语句优化 页面生存周期 SQL Server 存储过程的分页 利用鼠标中键缩放图片 - TomSun - 博客园 IE问题解决方法汇总 Calendar的相关问题. 无法打开注册表关键字错误----修改方法 N级无刷新连动菜单 - TomSun - 博客园 JScript中正则表达函数的说明与应用 正则表达式语法 ASP生成柱型体,折线图,饼图源代码 - TomSun - 博客园 ASP必读[常见问题集] 常用SQL语句(不断更新) Javascript里类的思想(zz) - TomSun - 博客园 JS写的Cookie类 ASP调用系统ping命令 c#.net常用的小函数和方法集 XMLHTTP---介绍 ASP.net 验证码(C#)
不间断连续图片滚动效果的制作方法 - TomSun - 博客园
TomSun · 2005-09-26 · via 博客园 - TomSun

先制作向上滚动的效果:
插入代码:
<!-- 指向链接图片url -->
<base href="http://www.it365cn.com">
<div id=demo style=overflow:hidden;height:150;width:90;background:#214984;color:#ffffff>
<div id=demo1>
<!-- 定义图片 -->
<img src="images/logo_1.gif">
<img src="images/logo/flashempire.gif">
<img src="images/logo.gif">
<img src="images/logo/5dmedia.gif">
<img src="images/logo/macromedia.gif">
<img src="images/logo/sucaiw.gif">
<img src="images/logo/blueieda.gif">
<img src="images/logo/htmlcn.gif">
<img src="images/logo/fwcn.gif">
</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>

制作向下滚动的效果:
将上面“制作向上滚动的效果”中的红色字体Js部分替换成:
<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.onmouseover
=function() {clearInterval(MyMar)}
demo.onmouseout
=function() {MyMar=setInterval(Marquee,speed)}
</script>

制作向左滚动的效果:
<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/logo_1.gif"><img src="images/logo/flashempire.gif"><img src="images/logo.gif"><img src="images/logo/5dmedia.gif"><img src="images/logo/macromedia.gif"><img src="images/logo/sucaiw.gif"><img src="images/logo/blueieda.gif"><img src="images/logo/htmlcn.gif"><img src="images/logo/fwcn.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.onmouseover
=function() {clearInterval(MyMar)}
demo.onmouseout
=function() {MyMar=setInterval(Marquee,speed)}
</script>

制作向右滚动的效果:
将上面“制作向左滚动的效果”中的红色字体Js部分替换成:
<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>