Показывать только следующие 10 дивы

Question

У меня есть список с сгенерированных дивы, как это:

<div class="news-loaded">...</div> 
<div class="news-loaded">...</div> 
<div class="news-loaded">...</div> 
<div class="news-loaded">...</div> 
etc. 

На свитке я хочу, чтобы исчезнуть в 10 дивы и показать поддельный погрузчик.

Теперь у меня есть этот код:

$(window).scroll(function(){ 
    $('.ajax-loader').each(function(i){ 

     var bottom_of_object = $(this).offset().top + $(this).outerHeight(); 
     var bottom_of_window = $(window).scrollTop() + $(window).height(); 
     if(bottom_of_window > bottom_of_object){ 
      $('.news-loaded').fadeIn(300); 
     } 

    }); 

}); 

Таким образом, если Аякса погрузчик ДИВ виден теперь загружает все дивы, но я просто хочу, чтобы загрузить следующие несколько див.

Answer 1

Я уверен, что есть много способов, но я склонен использовать slice().

В вашем случае, следующий может сделать трюк:

Заменить: $('.news-loaded').fadeIn(300);

С:

$('.news-loaded').slice(0, 9).fadeIn(300); 

EDIT: Кредит freedomn-m для этой расширенной версии выше:

$('.news-loaded').not(':visible').slice(0, 9).fadeIn(300);