建站学 - 轻松建站从此开始!

建站学-个人建站指南,网页制作,网站设计,网站制作教程

文字无缝滚动的javascript封装函数

时间:2009-05-09 01:06来源: 作者: 点击:
文字无缝滚动的javascript封装函数

程序代码

<script type="text/javascript">
<!--
//新闻滚动JS代码 (一次滚动高度,速度,停留时间,图层标记)
function startmarquee(lh,speed,delay,index){
    var t;
    var p=false;
    var o=$("gundongnews"+index);
    o.innerHTML+=o.innerHTML;
    o.onmouseover=function(){p=true}
    o.onmouseout=function(){p=false}
    o.scrollTop = 0;
    function start(){
        t=setInterval(scrolling,speed);
        if(!p) o.scrollTop += 2;
    }
    function scrolling(){
        if(o.scrollTop%lh!=0){
            o.scrollTop += 2;
            if(o.scrollTop>=o.scrollHeight/2) o.scrollTop = 0;
        }
        else{
        clearInterval(t);
        setTimeout(start,delay);
        }
    }
    setTimeout(start,delay);
}
//-->
</script>

 调用举例:

程序代码

<div id="other">
<ul id="gundongnews0">
<li>1</li>
<li>1</li>
<li>1</li>
</ul>
</div>
<script language="JavaScript" type="text/javascript">startmarquee(18,30,3000,0); </script>

  还需要定义样式:


 程序代码

/* 滚动文字 */
#other{ float:left; height: 18px; line-height:18px; padding:3px 0; width: 100%; margin:0; overflow: hidden;}
#gundongnews0,#gundongnews0 li{ clear:both; color:#FF6600; padding: 0px;height: 18px;overflow: hidden; line-height:18px }
#gundongnews0 a{ color:#FF6600;}

(责任编辑:admin)
织梦二维码生成器
顶一下
(1)
100%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片