首页 > 网络编程 > JavaScript > 广告代码 > javascript 单行文字 javascript 单行文字向上跑马灯滚动显示 2009-08-26 01:05:24 作者： 有时候我们需要在网站某个小角落或者显著的位置加一条链接，但是当同类链接越来越多的时候，我们就需要将链接滚动显示，这里的滚动不是我们平常所说公告栏滚动效果，而是滚动一行停留一段时间再滚动下一行的看似一帧一帧切换的效果。 代码如下： <html> <head> <script type="text/javascript"><!-- function startmarquee(lh,speed,delay) { var p=false; var t; var sh; var o=document.getElementById("marqueebox"); o.innerHTML+=o.innerHTML; o.style.marginTop=0; o.onmouseover=function(){p=true;} o.onmouseout=function(){p=false;} function start(){ sh = o.offsetHeight; o.style.height = sh; t=setInterval(scrolling,speed); if(!p) o.style.marginTop=parseInt(o.style.marginTop)-1+"px"; } function scrolling(){ if(parseInt(o.style.marginTop)%lh!=0){ o.style.marginTop=parseInt(o.style.marginTop)-1+"px"; if(Math.abs(parseInt(o.style.marginTop))>=sh/2) o.style.marginTop=0; }else{ clearInterval(t); setTimeout(start,delay); } } setTimeout(start,delay); } // --></script> </head> <body> <div style="overflow: hidden; height: 18px; margin-left: 5px;"> <div id="marqueebox" style="margin-top: -48px; height: 252px;"> <div class="tp"><a target="_blank" href="https://www.jb51.net" >脚本之家</a></div> <div class="tp"><a target="_blank" href="http://s.jb51.net" >服务器常用软件</a></div> <div class="tp"><a target="_blank" href="http://www.baidu.com" >百度</a></div> <div class="tp"><a target="_blank" href="http://liulanqi.jb51.net">浏览器</a></div> </div> </div> </body> <script type="text/javascript"><!-- startmarquee(18,20,3000); // --></script> </html> [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 您可能感兴趣的文章:原生JS实现图片跑马灯特效原生JS实现跑马灯效果js实现文字跑马灯效果js跑马灯代码(自写)JS实现状态栏跑马灯文字效果代码Javascript实现跑马灯效果的简单实例js 图片轮播(5张图片)js图片自动轮播代码分享(js图片轮播)最简单的JavaScript图片轮播代码(两种方法)JS实现图片轮播跑马灯
