整体向上移动,循环移动同样的数据

整体向上移动,循环移动同样的数据

var  lis,//一次向ul里添加的li
    bottomUl=0,//ul向上移的距离
    ulNum=0;//插入ul的个数
$.ajax({
    url: "./equpment/lastInfo",
    dataType: 'json',
    success: function (results) {
        lis=results;
      liAppengToUl(results);
      moveUl();
    }
});
function liAppengToUl(results){ //向ul中插入li,让ulNum为1;
    var frag=document.createDocumentFragment();
    $(results).each(function(index,car){
        var li='<li class="'+ulNum+'">Id为'+car.equpid+'的车辆'+car.equpname+'在'+car.gps_date+'耕作了'+parseFloat(car.area/666.6667).toFixed(2)+'亩地</li>';
        $(frag).append(li);
    });
    $("#ul").append(frag);
    ulNum+=1;
};
function moveUl(){
    bottomUl+=10;//向上移动的距离                                
  $("#ul").animate({bottom:bottomUl},500); var time=setTimeout(moveUl, 500);//0.5秒向上移一次ul,0.5秒移bottomUl的距离 if($("#ul").height()!=0){ var height=$("#ul").height(); } if(ulNum>=3){ $("li.0").remove();//移除第一次添加的所有li ulNum=0; liAppengToUl(lis);//让ulNum为0,会有一段空白,所以先添加lis } if(parseInt($("#ul").css(
'bottom'))>=(height-window.screen.height*0.9)){ //如果ul向上移的长度大于ul的高度(lis的高度)减去屏幕显示的高度,插入一次lis liAppengToUl(lis); } }
原文地址:https://www.cnblogs.com/mina-huojian66/p/8031898.html