当前位置: 代码迷 >> JavaScript >> 文字不间断滚动的代码,该怎么解决
  详细解决方案

文字不间断滚动的代码,该怎么解决

热度:267   发布时间:2012-02-11 09:51:34.0
文字不间断滚动的代码
HTML code


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript"> 
var flag = false;

function scroll(n){
 temp=n;
 News.scrollTop=News.scrollTop+temp;
 if(News.scrollTop >= News.children[1].offsetTop) {
  News.scrollTop = 0;
  scroll(n);
  return;
 }
 timer = setTimeout("scroll(temp)",120); // 滚动的速度
}

function control(n){
 if(flag){
  flag = false
  clearTimeout(timer);
 }
 else{
  flag =true
  scroll(n);
 }
}

function init() {
 var c = News.firstChild;
 var n = Math.ceil(parseInt(News.style.height) / c.offsetHeight);
 for(var i=0; i<n; i++) News.appendChild(c.cloneNode(true));
 return;
}
</script> 

 </head>
 <body onload="init();">
<center>
    <table border="0" width="263" cellpadding="0" style="border-collapse: collapse" id="table1">
    <tr>
     <td width="58%" valign="top">
      <div id="News" style="border:0px dashed; OVERFLOW: hidden; WIDTH: 262px; HEIGHT: 242px">
       <div onclick="control(3);">
       <table border="0" width="100%" cellpadding="0" style="border-collapse: collapse" id="table31">
       <tr>
                <td align="left">   武松在路上行了几日,来到阳谷县地面,离县城还远。正是晌午时候,武松走得肚中饥渴,望见前面有一家酒店,门前挑着一面旗,上头写着五个字∶“三碗不过冈。”<br />
                武松走进店里坐下,把哨棒靠在一边,叫道∶“主人家,快拿酒来吃。”只见店家拿了三只碗,一双筷子,一盘熟菜,放在武松面前,满满筛了一碗酒。武松拿起碗来一饮而尽,叫道∶“这酒真有气力!主人家,有饱肚的拿些来吃。”店家道∶“只有熟牛肉。”武松道∶“好的切二三斤来。”店家切了二斤熟牛肉,装了一大盘子,拿来放在武松面前,再筛一碗酒。武松吃了道∶“好酒!”店家又筛了一碗。<br /> 
                武松回到青石上坐了半歇,想道∶“天色看看黑了,如果再跳出一只大虫来,却怎么斗得过?还是先下冈去,明早再来理会。”武松在石头边找到了毡笠儿,转过乱树林边,一步步挨下冈来。
                </td>
                </tr>
                </table>
             </div>
   </div>
     </td>
    </tr>
    </table>
</center> 

 </body>
</html> 





这段代码可以实现内容的不间断滚动,可以兼容IE6,7,8.但是不兼容火狐,谷歌和遨游,请问该怎么修改呢?或者请提供一个兼容多个浏览器的代码。多谢了!!!!

------解决方案--------------------
试试这个,可以的
HTML code

<div id="demo" onmouseover="clearInterval(inter)" onmouseout="inter=setInterval(qswhMarquee,30)" style="overflow:hidden; width:262px; height:242px"> 
 
<div id="demo1"> 
  武松在路上行了几日,来到阳谷县地面,离县城还远。正是晌午时候,武松走得肚中饥渴,望见前面有一家酒店,门前挑着一面旗,上头写着五个字∶“三碗不过冈。”<br />
                武松走进店里坐下,把哨棒靠在一边,叫道∶“主人家,快拿酒来吃。”只见店家拿了三只碗,一双筷子,一盘熟菜,放在武松面前,满满筛了一碗酒。武松拿起碗来一饮而尽,叫道∶“这酒真有气力!主人家,有饱肚的拿些来吃。”店家道∶“只有熟牛肉。”武松道∶“好的切二三斤来。”店家切了二斤熟牛肉,装了一大盘子,拿来放在武松面前,再筛一碗酒。武松吃了道∶“好酒!”店家又筛了一碗。<br /> 
                武松回到青石上坐了半歇,想道∶“天色看看黑了,如果再跳出一只大虫来,却怎么斗得过?还是先下冈去,明早再来理会。”武松在石头边找到了毡笠儿,转过乱树林边,一步步挨下冈来。
</div> 
 
<div id="demo2"></div> 
 
</div> 
 
<script> 
var t=getid("demo"),t1=getid("demo1"),t2=getid("demo2"),sh=getid("show"); 
var inter; 
t2.innerHTML=t1.innerHTML; 
function qswhMarquee(){ 
if(t2.offsetTop<=t.scrollTop) 
t.scrollTop-=t1.offsetHeight; 
else 
t.scrollTop++; 
} 
inter=setInterval(qswhMarquee,30); 
function getid(id){ 
return document.getElementById(id); 
} 
</script> 
  相关解决方案