JS新闻无缝滚动封装函数

2016-02-19 15:52 20 1 收藏

get新技能是需要付出行动的,即使看得再多也还是要动手试一试。今天图老师小编跟大家分享的是JS新闻无缝滚动封装函数,一起来学习了解下吧!

【 tulaoshi.com - Web开发 】

程序代码

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

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

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

调用举例:

 程序代码

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

20090129 还需要定义样式:

 程序代码

/* 滚动文字 */
#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;}

来源:https://www.tulaoshi.com/n/20160219/1610598.html

延伸阅读
标签: Web开发
毫无疑问,John Resig 是一个细致且善于思考的人,对于我们通常使用的匿名函数,在他的细究之下,也能挖掘出一些新的东西。通常情况下,当一个函数调用自身时,递归就出现了,对于下面这样的函数调用,我们并不陌生。 1.function yell(n){ 2.       return n 0 ? yell(n-1) + "a" : "hiy&...
js的成员和方法好象没有private和public之分,列一下public的成员和方法 成员: name 控件的名字,既这个控件的变量名(必选) fName 时间的input的name,可以后台获取,也就是input的name属性(可选,默认为 m_input 方法: play() 使时间框呈现动态效果 getTime() 获取设定的时间 IE5.5+效果最佳,IE5运行也没有问题,就是css有些对不齐(I...
标签: Web开发
代码如下: function map(a,f){f(a);} function getRand(a,b) {     if(a)     {         b=b?b:0;         return Math.floor(Math.random()*a+b);     }else  &...
标签: Web开发
一外国佬写的。 有几种样式,点击那些example1234.html就能看见了。 可以研究一下下 http://www.n-son.com/scripts/jsScrolling/
标签: Web开发
代码如下: !-- //ASP分页函数 function ShowListPage(page,Pcount,TopicNum,maxperpage,strLink,ListName){     var alertcolor = '#FF0000';     maxperpage=Math.floor(maxperpage);     TopicNum=Math.floor(TopicNum);     p...

经验教程

499

收藏

17
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部