instafeed.js + scrollForever не хочет крутиться каруселька

355

15 июня 2017, 06:17

Скрипты instafeed.js + scrollForever подключаются в хедере сайта.

Ссылка на сайт https://codeshare.io/aJpjwq

Формирую блок изображений из инстаграмма с помощью скрипта instafeed.js. (В коде страницы указывается div с id и все "внутренности" формируются скриптом).

Перед закрытием добавлен код работы скроллера scrollForever.

В итоге должно быть что-то такое (1-й скроллер)

http://www.jqueryscript.net/demo/jQuery-Plugin-For-Infinite-Any-Content-Scroller-scrollForever/

Код (более полный можно увидеть в коде страницы по 1-й ссылке):

<script type="text/javascript"> 
var feed = new Instafeed({ 
get:"user", 
userId: ##########, // Instagram ID 
accessToken:"###############################", // Instagram AT 
limit: 30, 
resolution:"standard_resolution", 
template: `'<li><a href="{{link}}" target="_blank"><img src="{{image}}" /><div class="instainfo"><div class="instadiv"><span class="instaspan">FOLLOW ME ON <i class="fa fa-instagram"></i></span></div></div></a></li>'` 
}); 
feed.run(); 
</script> 
<div id="instagram-area" class="a"> 
<!-- Instafeed  --> 
<ul id="instafeed"></ul> 
<!-- End Instafeed  --> 
</div> 
.... 
<!-- Instagramm scroller Plugin initialization --> 
<script type="text/javascript"> 
(function($){ 
$(function(){ 
// var time1 = new Date; 
$("#instagram-area").scrollForever({delayTime:30});		 
}); 
})(jQuery); 
</script> 
<!-- End Instagramm scroller Plugin initialization --> 
</body>

Все, что внутри

<ul id="instafeed"></ul>

формируется скриптом instafeed.

Сравнил с примером, у меня для блока контейнера скрипт выставляет style="width: 0px;"...

Как его поправить, чтобы закрутился?

Answer 1

Напортачил в обрамлении кода для устранения ошибок jquery. Из-за этого и не крутилось...

Подсказали на форуме по яваскрипт javascript.ru. Теперь все работает.

var feed = new Instafeed({ 
get:"user", 
userId: ########, // Instagram ID 
accessToken:"#################", // Instagram AT 
limit: 30, 
resolution:"standard_resolution", 
template: '<li><a href="{{link}}" target="_blank"><img src="{{image}}" /><div class="instainfo"><div class="instadiv"><span class="instaspan">FOLLOW ME ON <i class="fa fa-instagram"></i></span></div></div></a></li>', 
after: function() { 
   jQuery("#instagram-area").scrollForever(); 
} 
}); 
jQuery(function() { 
  feed.run(); 
});