您的位置:首页 > 产品设计 > UI/UE

marquee 循环显示数据库中的记录,一次显示一条

2017-07-07 16:14 501 查看
需要显示的list:

List<SysNotice> sysNoticeList = sysNoticeService.getAllNoticeList();

每一条都展示为一个a标签:

<div id=marqueeDiv>

            <div id="marqueeA" style="display:none;">

                <%for(int i=0;i<sysNoticeList.size();i++){

                    if(null != sysNoticeList.get(i).getTitle()){%>

                    <a href="#" style="display:inline-block; width:100%" onclick="getNoticeInfo('<%=sysNoticeList.get(i).getNoticeId()%>')"><%=sysNoticeList.get(i).getTitle()%>  </a><input id="<%=sysNoticeList.get(i).getTitle()%>" type="hidden" value="<%=sysNoticeList.get(i).getTitle()%>">

                    <%}}%>

            </div>

        </div>

js 控制:

$(window).load(function() {

jump();

setInterval(jump, 13000);

});

var index = -1;

function jump() {

    var marquee = $('<marquee scrollamount=6 loop="1"  onMouseOut="start();" onMouseOver="stop();"></marquee>');

    var len = $("#marqueeA").find("a").length;

    if (index != len - 1) {

    $('marquee').remove();

    $("#marqueeA").find("a").eq(index + 1).clone().appendTo(

    marquee);

    marquee.appendTo('#marqueeDiv');

    index++;

    } else {

    $('marquee').remove();

    //初始化计数器

    index = -1;

    //最后一次setInterval循环的下一次,相当于初始化

    jump();

    }

}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: