不间断向上滚动的文字特效（滚动一行暂停一段时间再滚动）(

本文链接：https://blog.youkuaiyun.com/freejs/article/details/3336830

本文介绍了一个简单的HTML页面，该页面使用JavaScript实现了一种不间断向上滚动的文字特效。通过定时器控制每行文字滚动的时间间隔，达到连续滚动的效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

滚动一行暂停一段时间再滚动
<!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>不间断向上滚动的文字特效corange.cn</title>
<style>
*{ padding:0; margin:0;}
body{font-family: Arial, Helvetica, sans-serif; line-height:1.8; font-size:12px; background:url(http://pindao.kijiji.cn/upload_img/img/0805/20080519108770.jpg) no-repeat top right}
#wenchuan{ overflow:hidden; height:150px;}
a:link,a:visited{color:#333;text-decoration:none;}
a:hover,a:active{color:#000;text-decoration:underline;}
li{background:url(http://static.kijiji.cn/images/css/sidebar/li_green.gif?v=$1) no-repeat 5px 8px;padding-left:16px;overflow:hidden}
</style>
</head><body><ul id="wenchuan"><li><a href="http://chengdu.kijiji.cn/a22783901.html" target="_blank">罗富仙和孙玉兰</a></li><li><a href="http://chengdu.kijiji.cn/a22781765.html" target="_blank">急寻许秀军和苟玲父女两人！</a></li><li><a href="http://chengdu.kijiji.cn/a22781425.html" target="_blank">寻找汶川县城的陈永英！</a></li><li><a href="http://chengdu.kijiji.cn/a22778906.html" target="_blank">拜托你们帮我寻小妹刘冬梅！</a></li><li><a href="http://chengdu.kijiji.cn/a22778169.html" target="_blank">寻龚倩！</a></li><li><a href="http://chengdu.kijiji.cn/a22762069.html" target="_blank">寻找亲友报平安</a></li><li><a href="http://chengdu.kijiji.cn/a22761811.html" target="_blank">四川师大叫李明速回绵阳中医院看望病重母亲</a></li><li><a href="http://chengdu.kijiji.cn/a22740262.html" target="_blank">寻找秦丹</a></li><li><a href="http://chengdu.kijiji.cn/a22697588.html" target="_blank">我想找我映秀的朋友她叫高慧女21岁!</a></li><li><a href="http://chengdu.kijiji.cn/a22697390.html" target="_blank">想寻找曾经在公安校2002级治安一区队读书的在文川的柏星旺</a></li><li><a href="http://chengdu.kijiji.cn/a22697345.html" target="_blank">请转告所有青川木鱼中学的学生和家长!</a></li><li><a href="http://chengdu.kijiji.cn/a22691052.html" target="_blank">请帮我寻找茂县南新安乡的唐光映、唐伟等等众多的亲人！</a></li><li><a href="http://chengdu.kijiji.cn/a22691022.html" target="_blank">请帮我寻找亲人万良会，陈顺会，陈丽红</a></li><li><a href="http://chengdu.kijiji.cn/a22690982.html" target="_blank">请帮我寻找一下雅安市香花乡五组的魏世德，魏一！</a></li><li><a href="http://chengdu.kijiji.cn/a22690770.html" target="_blank">寻乘座阿坝至成都黄继琼</a></li><li><a href="http://chengdu.kijiji.cn/a22690741.html" target="_blank">阿坝师专的大一学生代伟刚</a></li><li><a href="http://chengdu.kijiji.cn/a22690294.html" target="_blank">寻乘座阿坝至成都的客车车牌川U21730的乘客黄继琼！</a></li><li><a href="http://chengdu.kijiji.cn/a22690248.html" target="_blank">寻谢恩发，谢恩洪，谢恩惠！</a></li><li><a href="http://chengdu.kijiji.cn/a22690080.html" target="_blank">寻刘春利、顾海东、杜建华，杨晓贵、罗小勇、贾春龙，周世辉！</a></li><li><a href="http://chengdu.kijiji.cn/a22690035.html" target="_blank">寻找一下阿坝师专的大一学生代伟刚！</a></li></ul><script type="text/javascript">
var scrollnews = document.getElementById('wenchuan');
var lis = scrollnews.getElementsByTagName('li');
var ml = 0;
var timer1 = setInterval(function(){
var liHeight = lis[0].offsetHeight;
var timer2 = setInterval(function(){
scrollnews.scrollTop = (++ml);
if(ml == liHeight){
clearInterval(timer2);
scrollnews.scrollTop = 0;
ml = 0;
lis[0].parentNode.appendChild(lis[0]);
}
},10);
},2000);
</script></body></html>