图片和文字滚动为什么不能同步
<table border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
 <tr>
  <td>#if ($title-picture.getData() != "") 
<img src="$title-picture.getData()" width="674" height="27" alt="" /> 
#end 
</td>
  </tr>
  #set ( $links = $web-link-name.getSiblings() )
  <tr>
  <td width="674" height="136" background="$background-picture.getData()" style="background-repeat:no-repeat" valign="top">
<div style="width:560px; margin-left:30px; line-height:23px; margin-top:5px;">
<div id=demo8 onmouseover=ii=1 style="OVERFLOW: hidden; WIDTH:560px; margin-top:10px; margin-left:14px;" onmouseout=ii=0>
  <table border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
  <td colspan="6" align="center" valign="middle" id="demo7">
<table width="209" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
  #foreach( $link in $links ) 
  #if ($link.getData() != "") 
  <td width="209" align="center" valign="middle">
<table width="170" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
  <td width="170" height="97" align="center">

<a href="$link.web-url.getData()">
<img class="img" src="$link.web-picture.getData()" width="144" border="0" height="95" style="border:1px solid #999999; padding:1px;" /></a>

</td>
  </tr>
  <tr>
  <td height="22" align="center"><a href="$link.web-url.getData()">$link.web-title-name.getData()</a></td>
  </tr>
</table>  
</td>
  #end
#end
  </tr>
  </table> </td>
  <td id=demo9 valign=top width="1"></td>
  </tr>
  </table>
</div>

  <SCRIPT>
var ii=0
demo9.innerHTML=demo7.innerHTML
function Marquee(){
if (ii==1)return
if(demo9.offsetWidth-demo8.scrollLeft<=0)

demo8.scrollLeft-=demo7.offsetWidth
else{
demo8.scrollLeft++
}
}
var MyMar=setInterval(Marquee,20);
  demo.onmouseover=function() {clearInterval(MyMar)};
  demo.onmouseout=function() {MyMar=setInterval(Marquee,20)};

</SCRIPT>

</div> </td>
  </tr>
  <tr>
  <td height="20">
#if ($bottom-picture.getData() != "") 
  <img src="$bottom-picture.getData()" width=&quo