ASP网页中 制作连续无缝滚动文字

代码
<div id=demo style=overflow:hidden;height:200;width:150>
<div id=demo1>
<img onclick="get_larger(this)" src='http://www.fengfly.com/images/face/image21.gif' style="CURSOR: pointer" >
<img onclick="get_larger(this)" src='http://www.fengfly.com/images/face/image21.gif' style="CURSOR: pointer" >
<img onclick="get_larger(this)" src='http://www.fengfly.com/images/face/image21.gif' style="CURSOR: pointer" >
<img onclick="get_larger(this)" src='http://www.fengfly.com/images/face/image21.gif' style="CURSOR: pointer" >
<img onclick="get_larger(this)" src='http://www.fengfly.com/images/face/image21.gif' style="CURSOR: pointer" >
</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>

 

<div id=demo style=overflow:hidden;height:200;width:150> 
	<div id=demo1>
		<img onclick="get_larger(this)"  src='http://www.fengfly.com/images/face/image21.gif'  style="CURSOR: pointer" >
		<img onclick="get_larger(this)"  src='http://www.fengfly.com/images/face/image21.gif'  style="CURSOR: pointer" >
		<img onclick="get_larger(this)"  src='http://www.fengfly.com/images/face/image21.gif'  style="CURSOR: pointer" >
		<img onclick="get_larger(this)"  src='http://www.fengfly.com/images/face/image21.gif'  style="CURSOR: pointer" >
		<img onclick="get_larger(this)"  src='http://www.fengfly.com/images/face/image21.gif'  style="CURSOR: pointer" >
	</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>

方法二:

 

方法二代码
<div style="width:200px;overflow:hidden">
<div style="position:relative;top:0px;left:0px;white-space:nowrap" id=news>
<span id=nbo>新闻内容1 新闻内容2 新闻内容3 新闻内容4 新闻内容5 新闻内容6 </span>
<script language=javascript>
//重复一次新闻内容
document.write(nbo.innerHTML);
</script>
</div>
</div>
<script language=javascript>
//实现不间断滚动
function newsScroll()
{
news.style.pixelLeft
=(news.style.pixelLeft-1)%nbo.offsetWidth;
}
timer1
=setInterval('newsScroll()',10) //更改第二个参数可以改变速度,值越小,速度越快。
</script>

 

 

posted on 2010-01-05 20:46  陈老师博客  阅读(1159)  评论(0编辑  收藏  举报

导航