html+jquery实现字幕滚动公告

css样式：

#affiche {

    color: red;
    display: block;
    width: 96%;
    height: 30px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}
.affiche_text {
    position: absolute;
    top: 0;
    left: 100%;
    line-height: 30px;
    display: block;
    word-break: keep-all;
    text-overflow: ellipsis;
    white-space: nowrap;

}

html标签：

<div id="affiche>
        <span class="affiche_text">字幕会滚动啦~字幕会滚动啦~字幕会滚动啦~字幕会滚动啦~字幕会滚动啦~</span>
</div> 

js：

//公告滚动 
    var timer = setTimeout(marquee, 1000);
    function marquee() {
        var scrollWidth =