ДОМ: Показать элементы только подарки в окне просмотра?

Question

Я хочу показывать элементы только в окне просмотра. Например, у меня есть модель ниже.

<div id="maincontainer">
 <div class="child" style="height:300px;display:block;">page1</div>
 <div class="child" style="height:400px;display:none;">page2</div>
 <div class="child" style="height:200px;display:none;">page2</div>
 <div class="child" style="height:100px;display:none;">page2</div>
 <div class="child" style="height:500px;display:none;">page2</div>
 <div class="child" style="height:600px;display:none;">page2</div>
 <div class="child" style="height:500px;display:none;">page2</div>
 <div class="child" style="height:100px;display:none;">page2</div>
<div class="child" style="height:400px;display:none;">page2</div>

И свойство стиля для этого

#maincontainer {
  height: 500px;
}

Теперь область просмотра maincontainer равна 500px. При прокрутке я хочу показать только элементы в maincontainer (отображать элементы блока в maincontainer). Как я могу это сделать? Кто-нибудь, пожалуйста, помогите мне с этой проблемой.