js實現上拉加載思路整理


1.整體模擬滾動

  監聽touchmove事件,比較 scrollTop 和 $scroller.scrollHeight() - $container.height()。

  缺點:滑動不流暢,

        translate需要開啟3D模式,同時添加慣性滑動動畫。但看起來不如原生。

2.原生滾動 + 懶加載:模擬滾動

  感覺怪怪的。

3.原生滾動(沒有上拉動作)

  監聽scroll,距離下方還有一段距離時,設置loader的display為block,開始加載,加載完成,設置loader的display為none。沒有上拉、松手等復雜過程。

  國內網址導航大多數都是這種思路,另外Loader都是單純圖片+文字顯示,沒有設置旋轉動畫。

  有些網站有省流量措施:

    之后兩次上拉正常,再以后不是自動加載,設置按鈕或超鏈接“點擊加載更多”。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM