JS实现无间断marquee
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<style type="text/css">
.box {border:#c5e4ff 1px solid;margin-top:10px;}
#foot {margin:0 auto;height:82px;padding:0 0 24px 0;width:901px;}
#foot_mid {float:left;margin-top:24px;overflow:hidden;width:900px;}
</style>
</HEAD>
<BODY>
<div id="foot" class="box">
<div id="foot_left"></div>
<div id="foot_mid">
<table>
<tr>
<td id="demo_b1" valign="bottom" align="center">
<table>
<tr>
<td width="118" valign="bottom"><img title="当乐网" src="http://www.uucun.com/images/p1.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="诺基亚" src="http://www.uucun.com/images/p2.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="3G门户" src="http://www.uucun.com/images/p3.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="Windows live" src="http://www.uucun.com/images/p4.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="搜狐" src="http://www.uucun.com/images/p5.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="飞信" src="http://www.uucun.com/images/p6.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="易查" src="http://www.uucun.com/images/p7.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="优视动景" src="http://www.uucun.com/images/p8.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="百度" src="http://www.uucun.com/images/p9.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="新浪网" src="http://www.uucun.com/images/p10.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="贝多" src="http://www.uucun.com/images/p11.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="移动书城" src="http://www.uucun.com/images/p12.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="魅媒科技" src="http://www.uucun.com/images/p16.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
</tr>
</table>
</td>
<td id="demo_b2" valign="top"><br><br></td>
</tr>
</table>
</div>
<div id="foot_right"></div>
</div>
</BODY>
</HTML>
<script type="text/javascript">
var speed_b = 30;
document.getElementById('demo_b2').innerHTML = document.getElementById('demo_b1').innerHTML;
function Marquee_b(){
if(document.getElementById('demo_b2').offsetWidth - document.getElementById('foot_mid').scrollLeft <= 0)
{
document.getElementById('foot_mid').scrollLeft -= document.getElementById('demo_b1').offsetWidth;
}
else
{
document.getElementById('foot_mid').scrollLeft++;
}
}
var MyMar_b=setInterval(Marquee_b,speed_b);
document.getElementById('foot_mid').onmouseover = function() {clearInterval(MyMar_b);}
document.getElementById('foot_mid').onmouseout = function() {MyMar_b=setInterval(Marquee_b,speed_b);}
</script>
<HEAD>
<TITLE> New Document </TITLE>
<style type="text/css">
.box {border:#c5e4ff 1px solid;margin-top:10px;}
#foot {margin:0 auto;height:82px;padding:0 0 24px 0;width:901px;}
#foot_mid {float:left;margin-top:24px;overflow:hidden;width:900px;}
</style>
</HEAD>
<BODY>
<div id="foot" class="box">
<div id="foot_left"></div>
<div id="foot_mid">
<table>
<tr>
<td id="demo_b1" valign="bottom" align="center">
<table>
<tr>
<td width="118" valign="bottom"><img title="当乐网" src="http://www.uucun.com/images/p1.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="诺基亚" src="http://www.uucun.com/images/p2.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="3G门户" src="http://www.uucun.com/images/p3.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="Windows live" src="http://www.uucun.com/images/p4.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="搜狐" src="http://www.uucun.com/images/p5.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="飞信" src="http://www.uucun.com/images/p6.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="易查" src="http://www.uucun.com/images/p7.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="优视动景" src="http://www.uucun.com/images/p8.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="百度" src="http://www.uucun.com/images/p9.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="新浪网" src="http://www.uucun.com/images/p10.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="贝多" src="http://www.uucun.com/images/p11.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="移动书城" src="http://www.uucun.com/images/p12.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
<td width="118" valign="bottom"><img title="魅媒科技" src="http://www.uucun.com/images/p16.gif" width="88" height="31" border="0" style="margin-right:20px"></td>
</tr>
</table>
</td>
<td id="demo_b2" valign="top"><br><br></td>
</tr>
</table>
</div>
<div id="foot_right"></div>
</div>
</BODY>
</HTML>
<script type="text/javascript">
var speed_b = 30;
document.getElementById('demo_b2').innerHTML = document.getElementById('demo_b1').innerHTML;
function Marquee_b(){
if(document.getElementById('demo_b2').offsetWidth - document.getElementById('foot_mid').scrollLeft <= 0)
{
document.getElementById('foot_mid').scrollLeft -= document.getElementById('demo_b1').offsetWidth;
}
else
{
document.getElementById('foot_mid').scrollLeft++;
}
}
var MyMar_b=setInterval(Marquee_b,speed_b);
document.getElementById('foot_mid').onmouseover = function() {clearInterval(MyMar_b);}
document.getElementById('foot_mid').onmouseout = function() {MyMar_b=setInterval(Marquee_b,speed_b);}
</script>