Question

滚动图片问题（用javascript写的，在oprea,火狐中显示正常，而ie就不行了）在线等

<script type="text/javascript">
document.write('<table align=center width="100%" border="0" cellpadding="0" cellspacing="0" style="BORDER-LEFT: #cccccc 1px solid;BORDER-RIGHT: #cccccc 1px solid">');
document.write(' <tr> ');
document.write(' <td width="100%" height="120" align=center class=border01 bgcolor=#FFFFFF>');
document.write(' <div id=demo style=overflow:hidden;style=width:698;align=center>');
document.write(' <table border=0 align=center cellpadding=1 cellspacing=1 cellspace=0 >');
document.write(' <tr>');
document.write(' <td valign=top bgcolor=ffffff id=marquePic1> ');
document.write(' <table width=90% border=0 cellspacing=0 cellpadding=0>');
document.write(' <tr align=center> ');
document.write(' <td width="185"><a href="#" target="new"><img src="images/1.jpg" width="180" height="147" border="0" /></a></td>');
document.write(' <td><a href="#" target="new"><img src="images/2.jpg" width="180" height="147" border="0" /></a></td>');
document.write(' <td><a href="#" target="new"><img src="images/3.jpg" width="180" height="147" border="0" /></a></td>');
document.write(' <td><a href="#" target="new"><img src="images/4.jpg" width="180" height="147" border="0" /></a></td>');
document.write(' <td><a href="#" target="new"><img src="images/5.jpg" width="180" height="147" border="0" /></a></td>');
document.write(' <td><a href="#" target="new"><img src="images/7.jpg" width="180" height="147" border="0" /></a></td>');
document.write(' </tr>');
document.write(' <tr align=center> ');
document.write(' </tr>');
document.write(' </table>');
document.write(' </td>');
document.write(' </tr>');
document.write(' </table>');
document.write(' </div>');
document.write(' </td>');
document.write(' </tr>');
document.write(' </table>');
var speed=30
function Marquee(){
if(demo.scrollLeft>=marquePic1.scrollWidth){
demo.scrollLeft=0
}else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}

</script>

Answer 1

这个是兼容IE和火狐的图片的滚动

<style type="text/css">
body,div{ margin:0; padding:0}
.scroll_div{ margin:0 auto; width:580px; height:62px; white-space: nowrap; overflow:hidden}
.scroll_div img{margin:auto 8px; border:solid 1px #ccc; width:120px; height:60px; }
.scroll_div li,.scroll_div ul,#scroll_begin,#scroll_end{ display:inline}
</style>
<script type="text/javascript">
function ScrollImgLeft(){
var speed = 20;
var scroll_begin=document.getElementById("scroll_begin");
var scroll_end=document.getElementById("scroll_end");
var scroll_div=document.getElementById("scroll_div");
scroll_end.innerHTML=scroll_begin.innerHTML;
function Marquee(){
if(scroll_end.offsetWidth-scroll_div.scrollLeft<=0)
scroll_div.scrollLeft-=scroll_begin.offsetWidth ;
else
scroll_div.scrollLeft++
}
var MyMar=setInterval(Marquee,speed);
scroll_div.onmouseover=function(){clearInterval(MyMar)}
scroll_div.onmouseout=function(){MyMar=setInterval(Marquee,speed)}
}
</script>
<div id="scroll_div" class="scroll_div">
<div id="scroll_begin">
<ul>
<li><a href="#"><img src="http://www.1netmedia.net/images/main_logo.gif" /></a></li>
<li><a href="#"><img src="http://www.1netmedia.net/images/main_logo.gif" /></a></li>
<li><a href="#"><img src="http://www.1netmedia.net/images/main_logo.gif" /></a></li>
<li><a href="#"><img src="http://www.1netmedia.net/images/main_logo.gif" /></a></li>
<li><a href="#"><img src="http://www.1netmedia.net/images/main_logo.gif" /></a></li>
<li><a href="#"><img src="http://www.1netmedia.net/images/main_logo.gif" /></a></li>
<li><a href="#"><img src="http://www.1netmedia.net/images/main_logo.gif" /></a></li>
<li><a href="#"><img src="http://www.1netmedia.net/images/main_logo.gif" /></a></li>
<li><a href="#"><img src="http://www.1netmedia.net/images/main_logo.gif" /></a></li>
</ul>
</div>
<div id="scroll_end"></div>
</div>
<script type="text/javascript">ScrollImgLeft();</script>