文字无缝滚动代码求更好的滚动代码

不显老的油腻大叔 2009-11-27 06:14:19

<div id="marquees">
<%=cm.getLinkBodyTableA(null,classID,5)%>
</div>

<script language="JavaScript">

marqueesHeight=200;
stopscroll=false;

with(marquees){
style.width=0;
style.height=marqueesHeight;
style.overflowX="visible";
style.overflowY="hidden";
noWrap=true;
onmouseover=new Function("stopscroll=true");
onmouseout=new Function("stopscroll=false");
}
document.write('<div id="templayer" style="position:absolute;z-index:1;visibility:hidden"></div>');

preTop=0; currentTop=0;

function init(){
templayer.innerHTML="";
while(templayer.offsetHeight<marqueesHeight){
templayer.innerHTML+=marquees.innerHTML;
}
marquees.innerHTML=templayer.innerHTML+templayer.innerHTML;
setInterval("scrollUp()",40);
}
document.body.onload=init;

function scrollUp(){
if(stopscroll==true) return;
preTop=marquees.scrollTop;
marquees.scrollTop+=1;
if(preTop==marquees.scrollTop){
marquees.scrollTop=templayer.offsetHeight-marqueesHeight;
marquees.scrollTop+=1;
}
}
</script>

<%=cm.getLinkBodyTableA(null,classID,5)%>这段是数据库里得到的文字内容是5行但是这段代码本来是5行依次向上无缝滚动但是却出现了第一行并排在第2行一起；就变成4行了向上无缝隙滚动

...全文

251 3 打赏收藏转发到动态举报

写回复

用AI写文章

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

crazylaa 2009-11-27

打赏
举报

import 的那两个类不要。

crazylaa 2009-11-27

打赏
举报

上面抄错地方了，是这里的jsp



<%@ page contentType="text/html; charset=UTF-8"%>

<%@page import="java.util.regex.Pattern"%>

<%@page import="java.util.regex.Matcher"%>

<HTML>

<HEAD>

<TITLE> New Document </TITLE>

<META NAME="Generator" CONTENT="EditPlus">

<META NAME="Author" CONTENT="">

<META NAME="Keywords" CONTENT="">

<META NAME="Description" CONTENT="">

</HEAD>



<BODY>

<div id="marquees">

<%

String text = "第一行\n第二行\n第3行\r\n第4行\r第5行\r";

text=text.replaceAll("\r","\n").replaceAll("\n\n","\n").replaceAll("[\\n]","<br>");

if(!text.endsWith("<br>")){

	text+="<br>";

}

%>

<%=text %>



</div>

<script language="JavaScript">



marqueesHeight=200;

stopscroll=false;



with(marquees){

  style.width=0;

  style.height=marqueesHeight;

  style.overflowX="visible";

  style.overflowY="hidden";

  noWrap=true;

  onmouseover=new Function("stopscroll=true");

  onmouseout=new Function("stopscroll=false");

}

document.write(' <div id="templayer" style="position:absolute;z-index:1;visibility:hidden"> </div>');



preTop=0; currentTop=0;



function init(){

  templayer.innerHTML="";

  while(templayer.offsetHeight <marqueesHeight){

    templayer.innerHTML+=marquees.innerHTML;

  }

  marquees.innerHTML=templayer.innerHTML+templayer.innerHTML;

  setInterval("scrollUp()",40);

}

document.body.onload=init;



function scrollUp(){

  if(stopscroll==true) return;

  preTop=marquees.scrollTop;

  marquees.scrollTop+=1;

  if(preTop==marquees.scrollTop){

    marquees.scrollTop=templayer.offsetHeight-marqueesHeight;

    marquees.scrollTop+=1;

  }

}

</script>



</BODY>

</HTML>

crazylaa 2009-11-27

打赏
举报

楼主，应该是你的 <%=cm.getLinkBodyTableA(null,classID,5)%> 里面文字的问题。如果你数据库里面是\r\n或者你后台的那个方法是以\r\n来分行的，可以用以下办法。我测试过可以的。



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE> New Document </TITLE>

<META NAME="Generator" CONTENT="EditPlus">

<META NAME="Author" CONTENT="">

<META NAME="Keywords" CONTENT="">

<META NAME="Description" CONTENT="">

</HEAD>



<BODY>

<div id="marquees">

abcde<br>bb<br>a<br>c<br>d<br>

</div>





<script language="JavaScript">



marqueesHeight=200;

stopscroll=false;



with(marquees){

  style.width=0;

  style.height=marqueesHeight;

  style.overflowX="visible";

  style.overflowY="hidden";

  noWrap=true;

  onmouseover=new Function("stopscroll=true");

  onmouseout=new Function("stopscroll=false");

}

document.write(' <div id="templayer" style="position:absolute;z-index:1;visibility:hidden"> </div>');



preTop=0; currentTop=0;



function init(){

  templayer.innerHTML="";

  while(templayer.offsetHeight <marqueesHeight){

    templayer.innerHTML+=marquees.innerHTML;

  }

  marquees.innerHTML=templayer.innerHTML+templayer.innerHTML;

  setInterval("scrollUp()",40);

}

document.body.onload=init;



function scrollUp(){

  if(stopscroll==true) return;

  preTop=marquees.scrollTop;

  marquees.scrollTop+=1;

  if(preTop==marquees.scrollTop){

    marquees.scrollTop=templayer.offsetHeight-marqueesHeight;

    marquees.scrollTop+=1;

  }

}

</script>



</BODY>

</HTML>