2个回答
展开全部
我这有个精简版的连续不间断的跑马灯的代码js的：<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<body>
<div id=roll1 style="OVERFLOW:hidden; WIDTH:450px;">
<table>
<tr>
<td id=rollleft1>
<table>
<tr>
<td>1111111111111111</td>
<td>2222222222222222</td>
<td>3333333333333333</td>
<td>4444444444444444</td>
</tr>
</table>
</td>
<td id=rollright1> </td>
</tr>
</table>
</div>
<table>
<tr>
<td>
<SCRIPT language=JavaScript type=text/JavaScript>
var speed1=22
rollright1.innerHTML=rollleft1.innerHTML
function Marquee1(){
if(rollright1.offsetWidth-roll1.scrollLeft<=0)
roll1.scrollLeft-=rollleft1.offsetWidth
else{
roll1.scrollLeft++
}
}
var MyMar1=setInterval(Marquee1,speed1)
roll1.onmouseover=function() {clearInterval(MyMar1)}
roll1.onmouseout=function() {MyMar1=setInterval(Marquee1,speed1)}
</SCRIPT>
</td>
</tr>
</table>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<body>
<div id=roll1 style="OVERFLOW:hidden; WIDTH:450px;">
<table>
<tr>
<td id=rollleft1>
<table>
<tr>
<td>1111111111111111</td>
<td>2222222222222222</td>
<td>3333333333333333</td>
<td>4444444444444444</td>
</tr>
</table>
</td>
<td id=rollright1> </td>
</tr>
</table>
</div>
<table>
<tr>
<td>
<SCRIPT language=JavaScript type=text/JavaScript>
var speed1=22
rollright1.innerHTML=rollleft1.innerHTML
function Marquee1(){
if(rollright1.offsetWidth-roll1.scrollLeft<=0)
roll1.scrollLeft-=rollleft1.offsetWidth
else{
roll1.scrollLeft++
}
}
var MyMar1=setInterval(Marquee1,speed1)
roll1.onmouseover=function() {clearInterval(MyMar1)}
roll1.onmouseout=function() {MyMar1=setInterval(Marquee1,speed1)}
</SCRIPT>
</td>
</tr>
</table>
</body>
</html>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<script language="JavaScript">
var msg = "跑马灯效果";
var speed = 300;
var msgud = " " + msg;
function titleScroll() {
if (msgud.length <msg.length) msgud += " - " + msg;
msgud = msgud.substring(1, msgud.length);
document.title = msgud.substring(0, msg.length);
window.setTimeout("titleScroll()", speed);
}
</script>在使用的<body>中加入 onload='window.setTimeout("titleScroll()",500)'再加一段实现横向跑马灯效果的js代码：<html>
<body>
<div id=demon style="OVERFLOW: hidden; WIDTH: 1008px; HEIGHT: 167px">
<div id=demon1>
<table cellspacing=0 cellpadding=0 width=1008 border=0>
<tbody>
<tr>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img34original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img35original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img36original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img295original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img62original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img63original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img64original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img202original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img203original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img204original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img205original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img206original.jpg" width=167 border=0> </a>
</td>
<td id=demon2></td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
<SCRIPT>
var speed1=1
demon2.innerHTML=demon1.innerHTML
function Marquee1(){
if(demon2.offsetWidth-demon.scrollLeft<=0)
demon.scrollLeft-=demon1.offsetWidth
else{
demon.scrollLeft++
}
}
var MyMar1=setInterval(Marquee1,speed1)
demon.onmouseover=function() {clearInterval(MyMar1)}
demon.onmouseout=function() {MyMar1=setInterval(Marquee1,speed1)}
</SCRIPT>
</html>再加一个实现纵向图片跑马灯效果的js代码：<div id=demon
style="OVERFLOW: hidden; WIDTH: 190px; HEIGHT: 575px">
<div id=demon1>
<table cellspacing=0 cellpadding=0 width=167 border=0>
<tbody>
<tr>
<td><a href=""
target=_blank><img height=50 alt=""
src="images/img34original.jpg" width=167
border=0></a></td>
</tr>
<tr>
<td height=5></td>
</tr>
<tr>
<td><a href=""
target=_blank><img height=50 alt=""
src="images/img35original.jpg" width=167
border=0></a></td>
</tr>
<tr>
<td height=5></td>
</tr>
<tr>
<td><a href=""
target=_blank><img height=50 alt=""
src="images/img36original.jpg" width=167
border=0></a></td>
</tr>
<tr>
<td height=5></td>
</tr>
<tr>
<td><a href=""
target=_blank><img height=50 alt=""
src="images/img295original.jpg" width=167
border=0></a></td>
</tr>
<tr>
<td height=5></td>
</tr>
其中的图片路径随具体情况改变， speed1代表滚动速度，越小越快！对于图片的宽度或高度，要跟div样式的宽或高搭配得当才能实现无限滚动！
var msg = "跑马灯效果";
var speed = 300;
var msgud = " " + msg;
function titleScroll() {
if (msgud.length <msg.length) msgud += " - " + msg;
msgud = msgud.substring(1, msgud.length);
document.title = msgud.substring(0, msg.length);
window.setTimeout("titleScroll()", speed);
}
</script>在使用的<body>中加入 onload='window.setTimeout("titleScroll()",500)'再加一段实现横向跑马灯效果的js代码：<html>
<body>
<div id=demon style="OVERFLOW: hidden; WIDTH: 1008px; HEIGHT: 167px">
<div id=demon1>
<table cellspacing=0 cellpadding=0 width=1008 border=0>
<tbody>
<tr>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img34original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img35original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img36original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img295original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img62original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img63original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img64original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img202original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img203original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img204original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img205original.jpg" width=167 border=0> </a>
</td>
<td>
<a href="" target=_blank><img height=50 alt=""
src="images/img206original.jpg" width=167 border=0> </a>
</td>
<td id=demon2></td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
<SCRIPT>
var speed1=1
demon2.innerHTML=demon1.innerHTML
function Marquee1(){
if(demon2.offsetWidth-demon.scrollLeft<=0)
demon.scrollLeft-=demon1.offsetWidth
else{
demon.scrollLeft++
}
}
var MyMar1=setInterval(Marquee1,speed1)
demon.onmouseover=function() {clearInterval(MyMar1)}
demon.onmouseout=function() {MyMar1=setInterval(Marquee1,speed1)}
</SCRIPT>
</html>再加一个实现纵向图片跑马灯效果的js代码：<div id=demon
style="OVERFLOW: hidden; WIDTH: 190px; HEIGHT: 575px">
<div id=demon1>
<table cellspacing=0 cellpadding=0 width=167 border=0>
<tbody>
<tr>
<td><a href=""
target=_blank><img height=50 alt=""
src="images/img34original.jpg" width=167
border=0></a></td>
</tr>
<tr>
<td height=5></td>
</tr>
<tr>
<td><a href=""
target=_blank><img height=50 alt=""
src="images/img35original.jpg" width=167
border=0></a></td>
</tr>
<tr>
<td height=5></td>
</tr>
<tr>
<td><a href=""
target=_blank><img height=50 alt=""
src="images/img36original.jpg" width=167
border=0></a></td>
</tr>
<tr>
<td height=5></td>
</tr>
<tr>
<td><a href=""
target=_blank><img height=50 alt=""
src="images/img295original.jpg" width=167
border=0></a></td>
</tr>
<tr>
<td height=5></td>
</tr>
其中的图片路径随具体情况改变， speed1代表滚动速度，越小越快！对于图片的宽度或高度，要跟div样式的宽或高搭配得当才能实现无限滚动！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
