實現無限/無限滾動Bigcommerce Stencil類別列表

Question

我想知道如何在類別頁面上的大型商業模具框架上實現無限滾動，因爲某些原因它沒有在類別頁面的底部顯示分頁。

是否有可能用JavaScript，然後請建議我如何能實現與大商業模板框架

下面這個功能是我的網站 http://silverforte.com/categories

<main class="page-content" id="product-listing-container"> 
    {{#if category.products}} 
     {{> components/category/product-listing}} 
    {{else}} 
     <p>{{lang 'categories.no_products'}}</p> 
    {{/if}} 
</main> 

感謝

Answer 1

你絕對可以進一步優化，但這涵蓋了基本的想法。

不可知的Bigcommerce，延遲加載AJAX請求是這樣的：

$.ajax({ 
    url: "your url here", 
    type: "Post", 
    success: function(response){ 
     // handle your success callback here 
     $("img.lazy").lazyload({ 
       effect : "fadeIn" 
     }); 
    } 
}); 

這並不完美，因爲你需要通過分類本身加載後續頁面和頁面。我會根據window.location.pathname或window.location.href設置一個變量，並修改該字符串以增加頁碼並將其用作ajax請求URL。

或者，您可以讓JS找到下一個選擇器並使用它來構建URL請求。

檢查出http://infiniteajaxscroll.com/更好的插件與BC一起使用。