js怎么实现文字向上滚动效果？

 我来答

5个回答

匿名用户
2013-07-10

展开全部

html已经封好了，不用js，
在html页面里用拷下面的标签试试
<marquee direction="down">
<dl>
<dt><b>我的账户</b>
<dd style="color:blue">基本资料</dd>
<dd style="color:blue">修改密码</dd>
<dd style="color:blue">修改头像</dd>
</dt>
<dt><b>好友</b>
<dd style="color:blue">我的好友</dd>
<dd style="color:blue">好友管理</dd>
<dd style="color:blue">查找好友</dd>
</dt>
</dl>
</marquee>
向上滚动改个参数即可。。

已赞过 已踩过<

评论收起

匿名用户
2013-07-10

展开全部

<!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=gb2312" />
<title>无标题文档</title>
<style type="text/css">

</style>
</head>

<body>
<div id="Marquee" class="Marquee">
<div style="width: 160px; height: 58px">间断-1-caiying2007</div>
<div style="width: 160px; height: 58px">间断-2-caiying2007</div>
<div style="width: 160px; height: 58px">间断-3-caiying2007</div>
</div>
<div id="Marquee1" class="Marquee">
<div style="width: 160px; height: 58px">间断-1-caiying2007</div>
<div style="width: 160px; height: 58px">间断-2-caiying2007</div>
<div style="width: 160px; height: 58px">间断-3-caiying2007</div>
</div>
<script>
function up(x){
var Mar = document.getElementById(x);
var child_div=Mar.getElementsByTagName("div")
var picH = 60;//移动高度
var scrollstep=3;//移动步幅,越大越快
var scrolltime=20;//移动频度(毫秒)越大越慢
var stoptime=3000;//间断时间(毫秒)
var tmpH = 0;
Mar.innerHTML += Mar.innerHTML;
function start(){
if(tmpH < picH){
tmpH += scrollstep;
if(tmpH > picH )tmpH = picH ;
Mar.scrollTop = tmpH;
setTimeout(start,scrolltime);
}else{
tmpH = 0;
Mar.appendChild(child_div[0]);
Mar.scrollTop = 0;
setTimeout(start,stoptime);
}
}
setTimeout(start,stoptime);
}
up("Marquee")
up("Marquee1")
</script>

</body>
</html>

已赞过 已踩过<

评论收起

青梅許紅顔丶
推荐于2016-05-16 · TA获得超过995个赞

知道小有建树答主

回答量：694

采纳率：87%

帮助的人：200万

我也去答题访问个人页

关注

展开全部

引用JS：

www.cyin.cn/js/front/supermarquee.js

HTML代码：

<div class="zuixinxuqiu" style="height: 197px; width: 678px; overflow: hidden; position: relative;">    
                       <ul>    
                               
                                   <dl class="clearfix">       
                                       <dt class="coladdress">    
                                           成都市</dt>          
                                   </dl>    
                                   
                                    <dl class="clearfix">       
                                       <dt class="coladdress">    
                                           成都市</dt>          
                                   </dl>    
                                    <dl class="clearfix">       
                                       <dt class="coladdress">    
                                           成都市</dt>          
                                   </dl>     
                                   <dl class="clearfix">       
                                       <dt class="coladdress">    
                                           成都市</dt>          
                                   </dl>    
                                    <dl class="clearfix">       
                                       <dt class="coladdress">    
                                           成都市</dt>          
                                   </dl>    
                                   
                       </ul>    
                   </div>

执行JS：

$(".zuixinxuqiu").kxbdSuperMarquee({    
               isEqual: false,    
               distance: 33,    
               time: 5,    
               direction: 'up'    
           });

已赞过 已踩过<

评论收起

匿名用户
2013-07-10

展开全部

<div class="dggd_r"id="demo">
<ul id="demo1">
<li>ET129409315CS 王** 您的货已发出，请查收</li>
<li>370087088177 关** 您的货已发出，请查收</li>
<li>370087088186 徐** 您的货已发出，请查收</li>
<li>370087088335 刘** 您的货已发出，请查收</li>
<li>EC413384680CS 周** 您的货已发出，请查收</li>
<li>EC413384702CS 傅** 您的产品已发出，请查收</li>
<li>EC413385402CS 何** 您的产品已发出，请查收</li>
<li>EC413385800CS 郭** 您的货已发出，请查收</li>
<li>EC413385813CS 杜** 您的货已发出，请查收 </li>
<li>EC413386235CS 孙** 您的货已发出，请查收</li>
<li>370087088344 孔** 您的货已发出，请查收</li>
<li>370087089048 李** 您的货已发出，请查收</li>
<li>370087089057 曹** 您的货已发出，请查收</li>
<li>370087089754 冯** 您的货已发出，请查收</li>
<li>370087539993 梁** 您的货已发出，请查收</li>
<li>370087089763 张** 您的货已发出，请查收</li>
<li>2649764414 黄** 您的货已发出，请查收</li>
<li>370087089772 范** 您的货已发出，请查收</li>
<li>370087089781 李** 您的货已发出，请查收</li>
</ul>
<ul id="demo2"></ul>
</div>
</div>
<script type="text/javascript">
varspeed=40;
vardemo2=document.getElementById("demo2");
vardemo1=document.getElementById("demo1");
vardemo=document.getElementById("demo");
demo2.innerHTML=demo1.innerHTML;
functionMarquee(){
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight;
else{
demo.scrollTop++;
}
}
varMyMar=setInterval(Marquee,speed);
demo.onmouseover=function(){clearInterval(MyMar)}
demo.onmouseout=function(){MyMar=setInterval(Marquee,speed)}
</script>
把这段代码差到页面中去，就好了。

已赞过 已踩过<

评论收起

匿名用户
2013-07-10

展开全部

<div class="dggd_r" id="demo">
            <ul id="demo1">
                <li>ET129409315CS 王** 您的货已发出，请查收</li>
                <li>370087090482 殷** 您的货已发出，请查收</li>
                <li>370087090491 颜** 您的货已发出，请查收 </li>
                <li>EC413385331CS 古丽** 您的货已发出，请查收</li>
                <li>370087090507 杨** 您的货已发出，请查收</li>
                <li>EC413385040CS 王** 您的货已发出，请查收</li>
                <li>370087090525 黄** 您的货已发出，请注意签收</li>
                <li>EC413385036CS 黄** 您的货已发出，请查收</li>
                <li>EC413383976CS 李** 您的货已发出，请查收</li>
                <li>370087090534 田** 您的货已发出，请注意签收</li>
                <li>EC413383018CS 郭** 您的货已发出，请查收</li>
                <li>370087091327 符** 您的货已发出，请查收</li>
                <li>EC413382423CS 刘* 您的货已发出，请查收</li>
                <li>370087090931 李** 您的货已发出，请查收</li>
                <li>EC413380802CS 付** 您的货已发出，请查收</li>
                <li>370087085129 林** 您的货已发出，请查收</li>
                <li>370087084919 陈** 您的货已发出，请查收</li>
                <li>370087092172 李 您的货已发出，请查收</li>
                <li>370087084900 涂** 您的货已发出，请查收</li>
                <li>370087091741 樊** 您的货已发出，请查收</li>
                <li>370087084885 董** 您的货已发出，请查收</li>
                <li>370087091732 张* 您的货已发出，请查收</li>
                <li>370087084285 曾** 您的货已发出，请查收</li>
                <li>370087084276 梁** 您的货已发出，请查收</li>
                <li>370087088680 张* 您的货已发出，请查收</li>
                <li>370087085996 秦** 您的货已发出，请查收</li>
                <li>370087085987 张** 您的货已发出，请查收</li>
                <li>370087085465 吴** 您的货已发出，请查收</li>
                <li>370087085456 林* 您的货已发出，请查收</li>
                <li>370087084876 何* 您的货已发出，请查收</li>
                <li>370087542093 张* 您的货已发出，请查收</li>
                <li>2649764410 谢* 您的货已发出，请查收</li>
                <li>370067847932 陈* 您的货已发出，请查收</li>
                <li>370087540243 罗* 您的货已发出，请查收</li>
                <li>370087540216 马* 您的货已发出，请查收</li>
                <li>370087540207 林** 您的货已发出，请查收</li>
                <li>370087540128 邵** 您的货已发出，请查收</li>
                <li>370087540119 冯** 您的货已发出，请查收</li>
                <li>顺丰370087084521 金** 您的产品已发出，请注意查收</li>
                <li>顺丰370087084415 罗** 您的产品已发出，请注意查收</li>
                <li>370087084512 冯** 您的产品已发出，请注意查收</li>
                <li>顺丰370087084503 钦** 您的产品已发出，请注意查收</li>
                <li>顺丰370087084497 任* 您的产品已发出，请注意查收</li>
                <li>顺丰370087084488 李** 您的产品已发出，请注意查收</li>
                <li>370087543210 欧** 您的产品已发出，请注意查收</li>
                <li>圆通2652274391 杨** 您的产品已发出，请注意查收</li>
                <li>顺丰370087084479 彭** 您的产品已发出，请注意查收</li>
                <li>370087084460 张 * 您的产品已发出，请注意查收</li>
                <li>顺丰370087543971 卢** 您的件已发出，请注意查收</li>
                <li>圆通2649764382 徐** 您的件已发出，请注意查收</li>
                <li>顺丰370087539869 付** 您的件已发出，请注意查收</li>
                <li>顺丰370087538916 杨* 您的件已发出，请注意查收</li>
                <li>圆通2649764375 梁* 您的件已发出，请注意查收</li>
                <li>顺丰370087538907 王** 您的件已发出，请注意查收</li>
                <li>顺丰370087538891 南** 您的件已发出，请注意查收</li>
                <li>顺丰370087538882 吕** 您的件已发出，请注意查收</li>
                <li>顺丰370087543865 朱** 您的件已发出，请注意查收</li>
                <li>顺丰370087538458 郭** 您的件已发出，请注意查收</li>
                <li>顺丰370087538430 徐** 您的件已发出，请注意查收</li>
                <li>圆通1870738900 阮** 您的件已发出，请注意查收</li>>
            </ul>
            <ul id="demo2"></ul>
        </div>
        </div>
        <script type="text/javascript">
			var speed=40;
			var demo2=document.getElementById("demo2");
			var demo1=document.getElementById("demo1");
			var demo=document.getElementById("demo");
			demo2.innerHTML=demo1.innerHTML;
			function Marquee(){
			if(demo2.offsetTop-demo.scrollTop<=0)
			demo.scrollTop-=demo1.offsetHeight;
			else{
			demo.scrollTop++;
			}
			}
			var MyMar=setInterval(Marquee,speed);
			demo.onmouseover=function() {clearInterval(MyMar)}
			demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
		</script>


本回答被网友采纳






已赞过已踩过<

你对这个回答的评价是？
评论收起

2条折叠回答

更多回答（3）

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

js怎么实现 文字向上滚动效果？

其他类似问题

为你推荐：

js怎么实现文字向上滚动效果？