首页 > 代码学习

firefox滚动图片

发布时间:2011-10-17 13:31:41 来源:星知苑 作者:星之宇

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

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

长宽高等参数也请在代码中修改,这里不一一说明了。
[break]
<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>

相关合集

  • 女生最喜欢用的拍照软件推荐
女生最喜欢用的拍照软件推荐

简介:有了手机就不用怕自己拍照出来的照片不够美丽了,小编有整理了不同种类的相机app分享推荐给你们,绝对是非常好用的,不仅是免费的可以直接的处理好各种喜欢什么样式的照片修改的效果,还有很多的贴图或者是模板可以提供选择,让你光彩夺目焕然一新。