There is no content at the beginning, scroll down and the content at the back will gradually load in
Look, are they the special effects of Kappa’s Tmall flagship store’s new spring and summer products? https://kappa.tmall.com/view_...
This special effect is achieved through fixed, which is the method usually used by websites for advertising.
Lazy loading solution, the main function is to reduce the load on the server
https://www.w3cways.com/1765....
I just saw your title and I thought it was drop-down loading. I usually use dropload to implement drop-down loading. Later, I saw what was written on the first floor and thought you might need js special effects.
Keeping the pull down and loading plus animation can be achieved using fullPage.js.
In fact, it is paging. You can refer to the following two:
jquery iscroll pull-up and drop-down loading content:
http://www.kuitao8.com/201501...
dropload.js:
https://github.com/ximan /drop...
I used the "load more" effect you mentioned on the order list page of the mall. I used the "stream loading" in Layui, and the effect was good.
demo: http://www.layui.com/demo/flo...
flow.load({
elem: '#LAY_demo2' //流加載容器
,isAuto: false //是否自動加載更多
,isLazyimg: true //圖片懶加載
,done: function(page, next){ //加載下一頁
//模擬用ajax請求數(shù)據(jù)
setTimeout(function(){
var lis = [];
for(var i = 0; i < 6; i++){
lis.push('<li><img lay-src="http://s17.mogucdn.com/p2/161011/upload_279h87jbc9l0hkl54djjjh42dc7i1_800x480.jpg?v='+ ( (page-1)*6 + i + 1 ) +'"></li>')
}
next(lis.join(''), page < 6); //假設(shè)總頁數(shù)為 6
}, 500);
}
});