兼容firfox,ie8+的上下走马灯（效果同ie marquee）

来源：互联网发布：一维数组与指针编辑：程序博客网时间：2024/06/05 10:03

<pre name="code" class="css"> #taskli {overflow:hidden;height: 210px;width: 220px;}#taskId{text-align: left;}#taskId p,#taskIds p {list-style-type: left;float: left;text-align: left;border-bottom:1px dashed #CCC;padding:3px 0;}

//js//obj 列表父节点的父节点 要有固定高度 本文210//height =210;//speed 速度 越大越慢(定时器频率 内容上行1px的时间 function marqu(obj,height,speed){   var move=function(){      if(obj.scrollHeight-obj.scrollTop<=height){ obj.scrollTop =0;      }else{ obj.scrollTop++; }   }   var mar = setInterval(move,speed);   obj.onmouseover=function(){ clearInterval(mar); }   obj.onmouseout=function(){ mar = setInterval(move,speed); } }

<li id="taskli" ><img src="pages/blank.png" alt="" />  //上下空白 使scroollTop归0时显得不突兀<div align="left" id="taskId">  <p>1111111111111</p>  <p>1111111111111</p>  <p>1111111111111</p>  <p>1111111111111</p>  <p>1111111111111</p>  <p>1111111111111</p></div><img src="<%=basePath %>pages/blank.png" alt="" /> <pre name="code" class="html">//上下插入的空白图片 白图高度要大于等于 taskli高度  之所以用空白图片而不用 div height 是因为 div受 div#taskId 高度影响 而我写的时候<p>是通过ajax插入的

</li>
<javascript>
var groud=document.getElementById('taskli');
marqu(groud,210,30);

之所以不用marquee是因为我发现marquee 的stop() 和 start() 方法竟然在firfox中报错

左右跑马的话应该把 js稍作修改即可我没写但应该改下 scrollWidth 和 scrollLeft即可吧

第一次认真发帖好激动

0 0