JavaScript代码: JavaScript代码 <script type="text/javascript" defer>var marquee_spd = 25; // 滚动速度,数值越小越快var repeat = null;var obj_marquee = document.getElementById("ImgList");//本例中的<div id=ImgList>function marquee_init(){ var obj_unit = obj_marquee.firstChild; var marquee_high = parseInt(obj_marquee.style.height); var marquee_wide = parseInt(obj_marquee.style.width); var unit_high = obj_unit.offsetHeight; var unit_wide = obj_unit.offsetWidth; var m = 0, n = 0, i = 0; var tmp = null; m = Math.ceil(marquee_wide / unit_wide); n = Math.ceil(marquee_high / unit_high); obj_unit.style.width = marquee_wide * (m + 1); obj_unit.rows[0].cells[0].style.width = obj_marquee.style.width; for(i = 0; i < m; i++) { tmp = obj_unit.rows[0].insertCell(-1); tmp.innerHTML = obj_unit.rows[0].cells[0].innerHTML; tmp.style.width = marquee_wide; tmp = null; } for(i = 0; i < n; i++) { obj_marquee.appendChild(obj_unit.cloneNode(true)); } return;}function marquee_show(direction){ switch(direction) { case "up": if(obj_marquee.scrollTop >= obj_marquee.children[1].offsetTop) { obj_marquee.scrollTop -= obj_marquee.firstChild.offsetHeight; } else { obj_marquee.scrollTop++; } break; case "down": if(obj_marquee.scrollTop <= 0) { obj_marquee.scrollTop += obj_marquee.firstChild.offsetHeight; } else { obj_marquee.scrollTop--; } break; case "left": if(obj_marquee.scrollLeft >= obj_marquee.firstChild.rows[0].cells[0].offsetWidth) { obj_marquee.scrollLeft -= obj_marquee.firstChild.rows[0].cells[0].offsetWidth; } else { obj_marquee.scrollLeft++; } break; case "right": if(obj_marquee.scrollLeft <= 0) { obj_marquee.scrollLeft += obj_marquee.firstChild.rows[0].cells[0].offsetWidth; } else { obj_marquee.scrollLeft--; } break; default: break; } return;}function marquee_doit(){ var direction = ""; direction = obj_marquee.getAttribute("direction"); if(direction != null) marquee_show(direction); direction = obj_marquee.getAttribute("direction2"); if(direction != null) marquee_show(direction); return;}function startMove(){marquee_init();repeat = setInterval("marquee_doit()", marquee_spd);obj_marquee.onmouseover = function() { clearInterval(repeat); }obj_marquee.onmouseout = function() { repeat = setInterval("marquee_doit()", marquee_spd); }}startMove();</script> DIV代码: 图片列表 <div id="ImgList" direction="left" style="overflow:hidden;height:100px;width:700px"> <table width="1728" border="0" cellspacing="0" cellpadding="0" ID="Table1"> <tr> <td> <table cellspacing=0 cellpadding=0 border=0 align="center" ID="Table2"> <tbody> <tr> <td bordercolor=#ffffff width="102" height="108"> <div align="center"><a href="#" target="_blank"><img src="1.jpg" width=86 border="0" hspace=8></a><br> <img src="space.gif" width="3" height="3"><br> <font color="#0000CC" >图片1</font></div> </td> <td bordercolor=#ffffff width="102" height="108"> <div align="center"><a href="#" target="_blank"><img src="2.jpg" width=86 border="0" hspace=8></a><br> <img src="space.gif" width="3" height="3"><br> <font color="#0000CC" >图片2</font></div> </td> </tr> </tbody> </table> </td> </tr> </table> </div> ---------20091113------------ 原JS代码不兼容FF,我做了下修改。 Code <script type="text/javascript" defer> var marquee_spd = 25; // 滚动速度,数值越小越快 var repeat = null; var obj_marquee = document.getElementById("ImgList"); //本例中的<div id=ImgList> function marquee_init() { var obj_unit = frist(obj_marquee); //obj_marquee.childNodes[1]; var marquee_high = parseInt(obj_marquee.style.height); var marquee_wide = parseInt(obj_marquee.style.width); var unit_high = obj_unit.offsetHeight; var unit_wide = obj_unit.offsetWidth; var m = 0, n = 0, i = 0; var tmp = null; m = Math.ceil(marquee_wide / unit_wide); n = Math.ceil(marquee_high / unit_high); obj_unit.style.width = marquee_wide * (m + 1); obj_unit.rows[0].cells[0].style.width = obj_marquee.style.width; for (i = 0; i < m; i++) { tmp = obj_unit.rows[0].insertCell(-1); tmp.innerHTML = obj_unit.rows[0].cells[0].innerHTML; tmp.style.width = marquee_wide; tmp = null; } for (i = 0; i < n; i++) { obj_marquee.appendChild(obj_unit.cloneNode(true)); } return; } function marquee_show(direction) { switch (direction) { case "up": if (obj_marquee.scrollTop >= frist(obj_marquee).offsetTop) { obj_marquee.scrollTop -= frist(obj_marquee).offsetHeight; } else { obj_marquee.scrollTop++; } break; case "down": if (obj_marquee.scrollTop <= 0) { obj_marquee.scrollTop += frist(obj_marquee).offsetHeight; } else { obj_marquee.scrollTop--; } break; case "left": if (obj_marquee.scrollLeft >= frist(obj_marquee).rows[0].cells[0].offsetWidth) { obj_marquee.scrollLeft -= frist(obj_marquee).rows[0].cells[0].offsetWidth; } else { obj_marquee.scrollLeft++; } break; case "right": if (obj_marquee.scrollLeft <= 0) { obj_marquee.scrollLeft += frist(obj_marquee).rows[0].cells[0].offsetWidth; } else { obj_marquee.scrollLeft--; } break; default: break; } return; } function marquee_doit() { var direction = ""; direction = obj_marquee.getAttribute("direction"); if (direction != null) marquee_show(direction); direction = obj_marquee.getAttribute("direction2"); if (direction != null) marquee_show(direction); return; } function startMove() { marquee_init(); repeat = setInterval("marquee_doit()", marquee_spd); obj_marquee.onmouseover = function() { clearInterval(repeat); } obj_marquee.onmouseout = function() { repeat = setInterval("marquee_doit()", marquee_spd); } } function frist(obj) { if (browser().ie) return obj.childNodes[0]; if (browser().firefox) return obj.childNodes[1]; } function browser() { var Sys = {}; var ua = navigator.userAgent.toLowerCase(); var s; (s = ua.match(/msie ([/d.]+)/)) ? Sys.ie = s[1] : (s = ua.match(/firefox//([/d.]+)/)) ? Sys.firefox = s[1] : (s = ua.match(/chrome//([/d.]+)/)) ? Sys.chrome = s[1] : (s = ua.match(/opera.([/d.]+)/)) ? Sys.opera = s[1] : (s = ua.match(/version//([/d.]+).*safari/)) ? Sys.safari = s[1] : 0; return Sys; } startMove();</script>