使用ionic在首页新闻中应用到的跑马灯效果的实现

在app中经常会有滚动的跑马灯效果的运用，如图所示为跑马灯效果：

代码如下：
html：

<div class="shouRight">
  <ul class="slideTopbox" slide-scroll style="top:0px;">
        <li><a href="#">1.我是第1行</a></li>
        <li><a href="#">2.我是第2行</a></li>
        <li><a href="#">3.我是第3行</a></li>
        <li><a href="#">4.我是第4行</a></li>
    </ul>
</div>

css：

.slideTopbox {
    width: 100%;
    z-index: 99;
    position: absolute;
    top: 0;
    color: #000;
}
.shouRight {
    width: 100%;
    z-index: 9999;
    position: absolute;
    top: 0;
    height: 30px;
    color: #000;
    overflow: hidden;
    line-height: 30px;
}

js：

angular.module('starter.services', [])
.directive('slideScroll', function($window, $timeout) {
    return {
        restrict: 'AE',
        link: function(scope, element, attr) {
            var itsWatch = scope.$watch("its", function(newvalue, oldvalue) {
                    itsWatch();
                    var i = 1;    //element是ul
                    var length = element[0].children.length;
                    var widthwindow = $window.innerWidth - 20;
                    var firstwidth = element[0].children[0].children[0].offsetWidth;
                    setInterval(function() {
                        if(i == length) {
                            i = 0;//初始位置
                            element[0].style.top  = "0px";
                        }
                        var topscorll = -(i * 30);
                        var widthself = element[0].children[i].children[0].offsetWidth;  //widthself：292

                        feeltoTop(topscorll)
                        i++;
                    }, 3000)
                    //向上滚动
                    function feeltoTop(topscorll){  //console.log(topscorll):topscorll是top值
                        var buchang = -10;
                        var feelTimer = setInterval(function(){
                            element[0].style.top = parseInt(element[0].style.top) + buchang + "px";
                            if(parseInt(element[0].style.top) <= topscorll){
                                element[0].style.top = topscorll + "px";
                                window.clearInterval(feelTimer);
                            }
                        },100);
                    }
            })
        }
    }
})

实现效果如图所示：