Не работает скрипт Infinite Scroll

Я столкнулся с проблемой при подключении этого плагина (https://infinite-scroll.com/). Пробовал подключить скрипт через CDN, как локально, так и через ссылку указанную автором. Далее автор указывает следующую конструкцию:

 <div class="container">
 <article class="post">...</article>
 <article class="post">...</article>
 <article class="post">...</article>
 ...
</div>

что кажется довольно логичным. Затем предлагается инициализировать скрипт. Один из способов выглядит так:

<div class="container" data-infinite-scroll='{ "path": ".pagination__next", "append": ".post", "history": false }'>

Однако в коде демо-страницы у .container нет тех параметров которые указаны в инструкции. Но они прописаны в другом div который содержит в себе все article (то есть она не соответствует инструкции) .

...
<div class="container">
  <h1 class="page-title">Full page demo</h1>
<div class="article-feed" data-infinite-scroll="{ &quot;path&quot;: &quot;.pagination__next&quot;, &quot;append&quot;: &quot;.article&quot;, &quot;status&quot;: &quot;.scroller-status&quot;, &quot;hideNav&quot;: &quot;.pagination&quot; }">
<article class="article">
...

На этом описание этого способа заканчивается, но на демо-странице есть еще вот такой код:

<div class="article-feed">
<!-- .articles will be added to .article-feed -->
<article class="article">...</article>
<article class="article">...</article>
...
</div>

<!-- status elements -->
<div class="scroller-status">
<div class="infinite-scroll-request loader-ellips">
...
</div>
<p class="infinite-scroll-last">End of content</p>
<p class="infinite-scroll-error">No more pages to load</p>
</div>

<!-- pagination has path -->
<p class="pagination">
<a class="pagination__next" href="page2.html">Next page</a>
</p>

В итоге у меня получилось следующее: Мой код

Но при этом ничего не работает и хром выдает такую штуку Ошибки Ошибка в JS

Почему хром ругается на url если я прописываю туда локальный файл? Помогите разобраться


Ответы (0 шт):