頁面特效 UI組件庫 菜單導航 窗口特效 幻燈片滑動 圖像相冊 表單 選項卡 表格 評分星級 手風琴 文本鏈接 布局 日歷 顏色選擇器 按鈕 圖表 html5 提示 ExtJS 在線客服 其他特效 地圖 樹形控件 移動開發 BootStrap 滑動條 文件上傳 表單驗證 分頁 播放器 Angular VUE

PC/手機無限下拉加載效果infiniteajaxscroll

布局 HTML我幫您 2天前  次瀏覽
現在很多網頁都有個體驗不錯的效果:瀏覽到頁面底部的時候,自動加載下一頁內容,也就是下拉加載效果,這種效果可以讓用戶不用點擊“下一頁”按鈕,也可以實現翻頁,無論在PC還是手機上,體驗效果都很不錯,下面我就介紹一下網站開發的時候如何實現下拉加載效果。

infiniteajaxscroll是一款滾動分頁插件(頁面滾動到最底部自動異步加載數據),功能完善,設置簡單。

PC/手機無限下拉加載效果infiniteajaxscroll

引入JS


 


HTML監聽寫法


...
...
...
...
JS實現



// import if you use the NPM package
import InfiniteAjaxScroll from '@webcreate/infinite-ajax-scroll';

let ias = new InfiniteAjaxScroll('.container', {
  item: '.item',
  next: '.next',
  pagination: '.pagination'
});








相關鏈接

發表評論

腾讯彩票兑奖