<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="roll1" style="OVERFLOW:hidden; WIDTH:450px;">
<table>
<tr>
<td id="rollleft1">
<table>
<tr>
<td><div><a href="#"><img/>1111111111111111</a></div></td>
<td>2222222222222222</td>
<td>3333333333333333</td>
<td>4444444444444444</td>
</tr>
</table>
</td>
<td id="rollright1"> </td>
</tr>
</table>
</div>
<script language="JavaScript" type="text/JavaScript">
var speed1 = 22;
var rollright1 = document.getElementById("rollright1");
var rollleft1 = document.getElementById("rollleft1");
var roll1 = document.getElementById("roll1");
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>
</body>
</html>
由于该段代码是以id=rollleft1的td为整体平移,因此在该td下可加div框架,如此就可实现同时包含图片及文字的跑马灯效果
PS:之前没有注意W3C标准的问题,要符合W3C标准,必须严格定义每一个变量,因此要增加var rollright1 = document.getElementById("rollright1");等代码