这是项目中用到的公告滚动,我记录下来
function callBacknoticeList(cdoRequest,cdoResponse,cdoReturn){ //公告列表回调 _shade_layer.hide();//这是加载提示关闭 if(cdoReturn.nCode == 0 && cdoResponse.exists("cdosNotice")){ var cdosNotice = cdoResponse.getCDOArrayValue("cdosNotice"); //列表数组 var nRecordCount = cdoResponse.getIntegerValue("nRecordCount"); //列表条数 /*如果列表条数为0,隐藏*/ if(nRecordCount == 0) { $("#indexNotice").parent().hide(); return false; }else{ $("#indexNotice").parent().show(); } for(i=0;i<cdosNotice.length;i++){ cdoObj = cdosNotice[i]; var strTitle = cdoObj.getStringValue("strTitle");//标题 var lId = cdoObj.getLongValue("lId");//id if(strTitle.length>"20"){ //大于20个字自动隐藏 var strTitle = strTitle.substring(0,20); strTitle = strTitle+"..."; } var htmlDiv = $("#tempNotice").html();//获取循环模版 htmlDiv=htmlDiv.replace("#strTitle#",strTitle);//替换标题 htmlDiv=htmlDiv.replace("#one1#",lId);//替换创建时间 //获取li var tempDiv=$("<div></div>"); tempDiv.html(htmlDiv); var li=tempDiv.children("li"); //立即执行函数 (function(li){ li.addEventListener("tap", function(){ var id=this.id; _index.messageCenterDetail(id); }, false); })(li[0]); $("#indexNotice").append(tempDiv.children()); } var indexI=-1; //实现N条数据不停滚动,且显示一条数据的 setInterval(function(){ indexI++; if(indexI==li.index()){ indexI=0; $("#indexNotice").css({top:"0px",opacity:0}); } $("#indexNotice").css({opacity:1}); $("#indexNotice").animate({top:"-"+30*indexI+"px"},"slow"); },1500); } }
<!--公告开始--> <div class="index_personalInformationBottom oneBorder" style="display: none"> <ul id="indexNotice"> <div id="tempNotice" style="display:none"> <li id="#one1#"> <p>#strTitle#</span></p> <div class="animQx" ></div> </li> </div> </ul> </div> <!--公告结束-->