firefox滚动图片

以下代码兼容ie6,firefox,chrome等浏览器,在多种浏览器下均正常滚动。

滚动速度,可以修改代码setTimeout("ScrollPic()",10);中10,这个数值越大,速度就越慢。
一般在15~20左右为好。部分还要根据你图片的大小等等。速度酌情更改

长宽高等参数也请在代码中修改,这里不一一说明了。

<script language="javascript">
function init()
{
var pics = document.getElementById("pictures").childNodes;
var length = pics.length;
ScrollPic.prototype.flag = 0;
for(var i = 0 ; i < length ; i++)
{
  // 兼容FireFox.....
  if(pics[i].tagName == "TD")
  {
   var td = document.createElement("TD");
   td.innerHTML = pics[i].innerHTML;
   document.getElementById("pictures").appendChild(td);
  }
}
document.getElementById("pictures").onmouseover = function ()
{
  ScrollPic.prototype.flag = 1;
}
document.getElementById("pictures").onmouseout = function ()
{
  if(ScrollPic.prototype.flag = 1)
  {
   ScrollPic.prototype.flag = 0;
   ScrollPic();
  }
}
ScrollPic();
}

function ScrollPic()
{
var layer = document.getElementById('MarqueePictues').getElementsByTagName("DIV")[0];
if(layer.scrollLeft++ == layer.scrollLeft)
{
  layer.scrollLeft = layer.clientWidth/2 - 40;
}
if(ScrollPic.prototype.flag == 0)
{
  setTimeout("ScrollPic()",10);
}
}
window.onload=init;
</script>
<div  id="MarqueePictues">
<div style="overflow:hidden;width:700px;">
<table border="0" cellspacing="0" cellpadding="0">
<tr id="pictures">
         <td><img src="1.jpg" /></td>
         <td><img src="1.jpg" /></td>
         <td><img src="1.jpg" /></td>
         <td><img src="1.jpg" /></td>
         <td><img src="1.jpg" /></td></tr>
</table>
</div>
</div>

目前有 0 条评论

昵称
邮箱
主页
提交
订阅