滚动显示文字或者图片

1⃣️直接利用标签marquee(但这种方法貌似已经呗W3C放弃了，不建议使用)

<ul class="list">
    <marquee direction="up" onmouseout="this.start()" onmouseover="this.stop()"        scrollamount="4">
        <c:forEach items="${releaseList}" var="release" begin="0" end="4">
            <li><a onclick="seeDatil('${release.id }');"><span>·</span>
              ${release.title }</a></li>
        </c:forEach>
    </marquee> 
    <!-- direction属性:设置滚动方式 
         onmouseout属性:设置当鼠标离开时要做什么 
         onmouseover属性:设置当鼠标移到上面时要做什么 
         scrollAmount属性:设置滚动的速度。1为最慢 -->
</ul>

2⃣️原生的js，编写的方法。（这个挺好，也行的）

<ul class="list" id="c1">
    <c:forEach items="${releaseList}" var="release" begin="0" end="5">
        <li><a onclick="seeDatil('${release.id }');">
           <span>·</span>${release.title }</a></li>
    </c:forEach>
</ul>
<ul class="list" id="c2"></ul>

#ca ul {
    margin: 0;
}

#ca {
    overflow: hidden;
    height: 100px;
}

var c1 = document.getElementById("c1");
var c2 = document.getElementById("c2");
var ca = document.getElementById("ca");
/*将第一个ul的值赋值给第二个  当第一个头部消失时 由第二个来显示*/
c2.innerHTML = c1.innerHTML;
var cas = null;
window.onload = function() {
    st();
}
cas = setInterval('st()', 50);

function st() {
    /*如果滚动长度大于第一个ul的高度  就需要将第一个ul回到原处 */
    if (ca.scrollTop >= c1.offsetHeight) {
        ca.scrollTop = 0;
    } else {
        ca.scrollTop++;
    }
    /*鼠标移入就清除清除定时器*/
    ca.onmouseover = function() {
        clearInterval(cas);
    }
    ca.onmouseout = function() {
        cas = setInterval('st()', 50);
    }
}

3⃣️简单易用的无缝滚动。jquery的kxbdMarquee实现。（推荐）
=》这种实现需要多引入一个js（jquery.kxbdmarquee.js）这个js网上找吧，如果找不到的可以留言，我会给你发。

<script type="text/javascript"  src="${basePath }/static/plugins/jquery/jquery.kxbdmarquee.js"></script>

<ul class="list">
    <c:forEach items="${releaseList}" var="release" begin="0" end="5">
        <li><a onclick="seeDatil('${release.id }');"><span>·</span>${release.title }</a></li>
    </c:forEach>
</ul>

#marquee {
    overflow: hidden;
}

$("#marquee").kxbdMarquee({
    isEqual : true, //所有滚动的元素长宽是否相等,true,false 
    loop : 0, //循环滚动次数，0时无限         
    direction : "up", //滚动方向，"left","right","up","down"         
    scrollAmount : 1, //步长         
    scrollDelay : 200 //时长
});

☀️☀️☀️