ロードするページがなくなったときにローダーを隠す方法

Question

https://vase.ai/blog/をビルドしているこのウェブサイトでは、無限スクロールのスクリプトを使用して、複数ページを1ページにしてスクロールしています。

ロードするページがもうない場合、ローダー（回転するもの）を非表示にしたいと考えています。私は

window.addEventListener('error', function(e) { 
    $('loading').fadeOut() 
}, true); 

？私は何かを逃しています。しかし、それは動作しません。次のコードは、 Failed to load resource: the server responded with a status of 404 (Not Found))（エラーを検出し、隠れを実行するために私を助けることができるかもしれないことを考え出し、私はロードするために使用するコードより：

//implementing infinite scrolling 
$grid.infinitescroll({ 
    // Pagination element that will be hidden 
    navSelector: '.pagination', 

    // Next page link 
    nextSelector: '.pagination a', 

    // Selector of items to retrieve 
    itemSelector: '.grid-blog', 
}, 

// Function called once the elements are retrieved 
function(new_elts) { 
    var elts = $(new_elts).css('opacity', 0); 

    elts.animate({opacity: 1}); 
    $grid.packery('appended', elts); 

    $('.target-resize').textfill({ 
    maxFontPixels: 36, 
    changeLineHeight:false 
    }) 

    $grid.packery({ 
    itemSelector: '.grid-blog', 
    gutter: 20, 

    }) 
});  

Answer 1

それはあなたのコンテンツをロードするためのHTTP呼び出しを行うコードをせずに、あなたの質問に答えるのは難しい。しかし、

1）あなたは、エラーを持っているし、まだすべきコンテンツを有することができます。ロードされている場合は、ローダーが消えてしまいます内容がまだ読み込まれている場合

2）ロードする必要のあるものをサイトに送る必要があります。 URLの配列など、すべてのコンテンツが読み込まれたときにローダーを非表示にすることができます。

3）コンテンツを取得するためにhttpcallsを作成する機能が必要です。この関数はコールバックを持つ必要があります。このコールバックでは、エラーをキャッチしてローダーを隠すことができるはずです。

私はあなたの例文に表示するコードの量に関する情報をさらに提供することはできません。

---

編集：あなたのコードを見た後、あなたがしようとするかもしれない：私はこれが正しい解決策だとは思わない

// Function called once the elements are retrieved 
function(new_elts) { 
    if(!new_elts) { 
     $('loading').fadeOut(); 
     return; 
    } 
... 
} 

、あなたのプラグインが停止する組み込み関数を持っている必要があります新しいページを呼び出すのですが、http呼び出しを行う関数やURLの配列/イテレータが表示されないので、難しい問題です。

あなたはこのデモをチェックする必要があります：あなたは、余分なページをロードするために使用しているコードを含めることができhttps://codepen.io/desandro/pen/rwwoGe