关于滚动功能解决思路

2012-02-12

关于滚动功能为什么我用以下三个页面测试滚动，到最后总是有跳动现象啊，那为大哥帮忙看一下调用页面11.htm

关于滚动功能
为什么我用以下三个页面测试滚动，到最后总是有跳动现象啊，那为大哥帮忙看一下

调用页面11.htm
<iframe id= "adtxt1 " align= "center " style= "WIDTH: 590; HEIGHT: 92 " src= "00.htm " name= "iframe1 " frameborder= "0 " scrolling= "no "> </iframe>

代码页面00.htm

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN ">
<HTML> <HEAD> <TITLE> 滚动新闻 </TITLE>
<META http-equiv=Content-Type content= "text/html; charset=gb2312 ">
<STYLE type=text/css>
body,TD {
FONT-SIZE: 9pt
}
</STYLE>
<BODY scroll=no leftmargin= "0 " topmargin= "0 " marginwidth= "0 " marginheight= "0 ">
<table border=0 align= "center " cellpadding=0 cellspacing=0>
<tr>
<td height=23 align= "center " nowrap> <a href= "http://photo.zsnet.com/tounament/ " target= "_blank "> 1中山市“美好生活一瞬间”数码摄影比赛 </a> 　　
<a href= "http://www.zsyjedu.net.cn/jianjie.htm " target= "_blank "> <font color= "#FF0000 "> 中国商业技师协会职业资格权威认证培训 </font> </a>
</td>
</tr>

<tr>
<td height=23 align= "center " nowrap> <a href= "http://wh3351.zsnet.com/news/news_view.asp?news_id=5670 " target= "_blank "> 2“好山好水好儿女”中山文化名人推广月 </a> 　　
<a href= "http://news.zsnet.com/newscontent.asp?newsid=77777 " target= "_blank "> 中山市劳动和社会保障工作情况通报 </a> </td>
</tr>


<tr>
<td height=23 align= "center " nowrap> <a href= "http://photo.zsnet.com/tounament/ " target= "_blank "> 3中山市“美好生活一瞬间”数码摄影比赛 </a> 　　
<a href= "http://www.zsyjedu.net.cn/jianjie.htm " target= "_blank "> <font color= "#FF0000 "> 中国商业技师协会职业资格权威认证培训 </font> </a>
</td>
</tr>
</table>
<table border=0 align= "center " cellpadding=0 cellspacing=0>
<tr>
<td height=23 align= "center " nowrap> <a href= "http://photo.zsnet.com/tounament/ " target= "_blank "> 4中山市“美好生活一瞬间”数码摄影比赛 </a> 　　 <a href= "http://www.zsyjedu.net.cn/jianjie.htm " target= "_blank "> <font color= "#FF0000 "> 中国商业技师协会职业资格权威认证培训 </font> </a> </td>

</tr>

<tr>
<td height=23 align= "center " nowrap> <a href= "http://wh3351.zsnet.com/news/news_view.asp?news_id=5670 " target= "_blank "> 5“好山好水好儿女”中山文化名人推广月 </a> 　　 <a href= "http://news.zsnet.com/newscontent.asp?newsid=77777 " target= "_blank "> 中山市劳动和社会保障工作情况通报 </a> </td>
</tr>


<tr>
<td height=23 align= "center " nowrap> <a href= "http://photo.zsnet.com/tounament/ " target= "_blank "> 6中山市“美好生活一瞬间”数码摄影比赛 </a> 　　 <a href= "http://www.zsyjedu.net.cn/jianjie.htm " target= "_blank "> <font color= "#FF0000 "> 中国商业技师协会职业资格权威认证培训 </font> </a> </td>
</tr>
</table>
<table border=0 align= "center " cellpadding=0 cellspacing=0>
<tr>
<td height=23 align= "center " nowrap> <a href= "http://photo.zsnet.com/tounament/ " target= "_blank "> 7中山市“美好生活一瞬间”数码摄影比赛 </a> 　　 <a href= "http://www.zsyjedu.net.cn/jianjie.htm " target= "_blank "> <font color= "#FF0000 "> 中国商业技师协会职业资格权威认证培训 </font> </a> </td>
</tr>

<tr>
<td height=23 align= "center " nowrap> <a href= "http://wh3351.zsnet.com/news/news_view.asp?news_id=5670 " target= "_blank "> 8“好山好水好儿女”中山文化名人推广月 </a> 　　 <a href= "http://news.zsnet.com/newscontent.asp?newsid=77777 " target= "_blank "> 中山市劳动和社会保障工作情况通报 </a> </td>
</tr>


<tr>
<td height=23 align= "center " nowrap> <a href= "http://photo.zsnet.com/tounament/ " target= "_blank "> 9中山市“美好生活一瞬间”数码摄影比赛 </a> 　　 <a href= "http://www.zsyjedu.net.cn/jianjie.htm " target= "_blank "> <font color= "#FF0000 "> 中国商业技师协会职业资格权威认证培训 </font> </a> </td>
</tr>
</table>
<table border=0 align= "center " cellpadding=0 cellspacing=0>
<tr>
<td height=23 align= "center " nowrap> <a href= "http://photo.zsnet.com/tounament/ " target= "_blank "> 10中山市“美好生活一瞬间”数码摄影比赛 </a> 　　 <a href= "http://www.zsyjedu.net.cn/jianjie.htm " target= "_blank "> <font color= "#FF0000 "> 中国商业技师协会职业资格权威认证培训 </font> </a> </td>

</tr>

<tr>
<td height=23 align= "center " nowrap> <a href= "http://wh3351.zsnet.com/news/news_view.asp?news_id=5670 " target= "_blank "> 11“好山好水好儿女”中山文化名人推广月 </a> 　　 <a href= "http://news.zsnet.com/newscontent.asp?newsid=77777 " target= "_blank "> 中山市劳动和社会保障工作情况通报 </a> </td>
</tr>


<tr>
<td height=23 align= "center " nowrap> <a href= "http://photo.zsnet.com/tounament/ " target= "_blank "> 12中山市“美好生活一瞬间”数码摄影比赛 </a> 　　 <a href= "http://www.zsyjedu.net.cn/jianjie.htm " target= "_blank "> <font color= "#FF0000 "> 中国商业技师协会职业资格权威认证培训 </font> </a> </td>
</tr>
</table>
<table border=0 align= "center " cellpadding=0 cellspacing=0>
<tr>
<td height=23 align= "center " nowrap> <a href= "http://photo.zsnet.com/tounament/ " target= "_blank "> 13中山市“美好生活一瞬间”数码摄影比赛 </a> 　　 <a href= "http://www.zsyjedu.net.cn/jianjie.htm " target= "_blank "> <font color= "#FF0000 "> 中国商业技师协会职业资格权威认证培训 </font> </a> </td>
</tr>



</table>

<SCRIPT language=JavaScript src= "scrolltext.js "> </SCRIPT>
</BODY>
</HTML>

JS文件 scrolltext.js
内容
var stopscroll=false;
var preTop=0;
//var newTop=0;
var currentTop=0;
var stoptime=0;
var iInterval ;

function init_srolltext(){
document.body.scrollTop=0;
document.body.onmouseover = new Function( "stopscroll=true ");
document.body.onmouseout = new Function( "stopscroll=false ");
document.body.oncontextmenu = new Function( "return false; ");
document.body.onselectstart = new Function( "return false; ");
iInterval = setInterval( "scrollUp() ",25);
}

function scrollUp(){
if(stopscroll==true) return;
currentTop+=4; //每次滚动 1 个象素
if(currentTop==96){ //刚滚动完一行后(每行高23)
stoptime+=1; //停顿时间累计 1 个单位时间(25毫秒)
currentTop-=4; //滚动位移数恢复原值

if(stoptime==100){ //停顿时间累计 100 个单位时间后重新计算滚动位移和停顿时间
currentTop=0;
stoptime=0;
}
}else{
document.body.scrollTop = preTop +4; //滚动 1 个象素
if(preTop < document.body.scrollTop){
preTop = document.body.scrollTop ;
}
else {//如果滚动到末尾了(滚动跟没滚一样)
preTop = 1
document.body.scrollTop = 1;
}
}
}

init_srolltext(); //启动

[解决办法]
给你看看我写的，没有跳的现象，自己改改吧

function scrollUp(){
if(stopscroll) return;
currentTop += 1;
if(currentTop == 211) {
stoptime += 1;
currentTop -= 1;
if(stoptime == 180) {
currentTop = 0;
stoptime = 0;
}
}else{
preTop = scrollElem.scrollTop;
scrollElem.scrollTop += 1;
if(preTop == scrollElem.scrollTop){
scrollElem.scrollTop = leftElem.offsetHeight-marqueesHeight;
scrollElem.scrollTop += 1;
}
}
}

热点排行

ASP

关于滚动功能解决思路