<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td> <div id="demo" style="OVERFLOW: hidden; WIDTH: 400px; HEIGHT: 100px">
            <table height="43" cellspacing="0" cellpadding="0" width="800" border="0">
                <tbody>
                    <tr>
                        <td id="demo1">
                        <table cellspacing="0" cellpadding="0" border="0">
                            <tbody>
                                <tr>
                                    <td align="center"><img src="http://zi.csdn.net/ren300-ok.gif" width="100" height="100" /><img src="http://zi.csdn.net/ren300-ok.gif" width="100" height="100" /><img src="http://zi.csdn.net/ren300-ok.gif" width="100" height="100" /><img src="http://zi.csdn.net/ren300-ok.gif" width="100" height="100" /></td>
                                </tr>
                            </tbody>
                        </table>
                        </td>
                        <td id="demo2"></td>
                    </tr>
                </tbody>
            </table>
            </div>
</td>
  </tr>
</table>
<script language="javascript" type="text/javascript">
<!--
var speed=15;
var speedStep=1;
demo2.innerHTML=demo1.innerHTML;
function MarqueeToLeft()
{
if(demo1.offsetWidth-demo.scrollLeft<=0)
{
demo.scrollLeft-=demo1.offsetWidth;
}
else
{
demo.scrollLeft+=speedStep;
}
}
var MyMar1=setInterval(MarqueeToLeft,speed)
demo.onmouseover=function() {clearInterval(MyMar1)}
demo.onmouseout=function() {MyMar1=setInterval(MarqueeToLeft,speed)}
//-->
</script>