文字向上滾動

function autoScroll(obj) {
    $(obj).find("ul").animate({
        marginTop: "-30px"
    }, 1000, function () {
        $(this).css({ marginTop: "0px" }).find("li:first").appendTo(this);
    })
}

function txtMaquee() {
    var scroll = setInterval('autoScroll(".js-join__lt")', 1500);
    $(".js-join__lt").hover(function () {
        clearInterval(scroll);
    }, function () {
        scroll = setInterval('autoScroll(".js-join__lt")', 1500);
    });
}

html部分

            <div class="enrol__scroll">
                <img src="~/Content/images/activity/designer/enrol-img.png" class="enrol__img" />
                <span class="enrol__text">這是一條滾動的訊息:</span>
                <div class="js-join__lt">
                    <ul style="margin-top: 0px;">
                        <li>張**先生剛剛報名成功</li>
                        <li>鄧**先生剛剛報名成功</li>
                        <li>錢**先生剛剛報名成功</li>
                        <li>馬**先生剛剛報名成功</li>
                        <li>遊*先生剛剛報名成功</li>
                        <li>陳*先生剛剛報名成功</li>
                        <li>方**先生剛剛報名成功</li>
                        <li>史女士剛剛報名成功</li>
                        <li>胡**先生剛剛報名成功</li>
                        <li>安*女士剛剛報名成功</li>
                        <li>胡**女士剛剛報名成功</li>
                        <li>崔**先生剛剛報名成功</li>
                        <li>張**先生剛剛報名成功</li>
                        <li>趙**先生剛剛報名成功</li>
                        <li>譚**先生剛剛報名成功</li>
                        <li>劉**女士剛剛報名成功</li>
                        <li>袁**女士剛剛報名成功</li>
                        <li>王**先生剛剛報名成功</li>
                        <li>周*女士剛剛報名成功</li>
                        <li>樸**先生剛剛報名成功</li>
                    </ul>
                </div>
            </div>

css

.enrol__scroll {
    overflow: hidden;
    position: relative;
    margin-top: 40px;
    padding-left: 134px;
    line-height: 30px;
    font-size: 16px;
    color: #f0f0f1
}
.js-join__lt {
    display: inline-block;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
}

.enrol__text {
    padding: 0 10px;
    vertical-align: 8px;
}
.js-join__lt li {
    color: #f0f0f1
}

效果：