基于jquery的文字向上跑动

2015/07/09 53005

清华大佬耗费三个月吐血整理的几百G的资源，免费分享！....>>>

想实现一个类似跑马灯的效果,发现跑马灯有空格.效果也不美观,于是用jquery写了个

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<div class="recordList"> 
                        <ul class="tpl-rotate-recordList" style="margin-top: 0px;"> 
                            <li class="tpl-rotate-recordList-item"> 
                                恭喜187****5204获得1000RBM 
                            </li> 
                            <li class="tpl-rotate-recordList-item"> 
                                恭喜137****1372获得1000RBM 
                            </li> 
                            <li class="tpl-rotate-recordList-item"> 
                                恭喜156****0276获得1000RBM 
                            </li> 
                            <li class="tpl-rotate-recordList-item"> 
                                恭喜139****9856获得1000RBM 
                            </li> 
                            <li class="tpl-rotate-recordList-item"> 
                                恭喜136****0580获得1000RBM 
                            </li> 
                            <li class="tpl-rotate-recordList-item"> 
                                恭喜136****0580获得1000RBM 
                            </li> 
                            <li class="tpl-rotate-recordList-item"> 
                                恭喜138****8118获得1000RBM 
                            </li> 
                            <li class="tpl-rotate-recordList-item"> 
                                恭喜136****5555获得1000RBM 
                            </li> 
                            <li class="tpl-rotate-recordList-item"> 
                                恭喜136****0580获得1000RBM 
                            </li> 
                            <li class="tpl-rotate-recordList-item"> 
                                恭喜136****0580获得1000RBM 
                            </li> 
                        </ul> 
                    </div>

js代码
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
/*自动轮换xuyw*/ 
    var AutoScroll = function(a) { 
        $(a).find("ul:first").animate( { 
            marginTop : "-20px" 
        }, 500, function() { 
            $(this).css( { 
                marginTop : "0px" 
            }).find("li:first").appendTo(this) 
        }) 
    } 
    if ($(".recordList ul li").length > 0) { 
        setInterval('AutoScroll(".recordList")', 2000) 
    } else { 
        $(".recordList").hide() 
    }