加載網頁的一部分

Question

我有一個非常大的網頁，加載了很多盒子裏面的圖像。在頁面上可以有3-100個盒子的任何地方，每個盒子的高度爲1000px。

<div id="container"> 
    <div class="box"></div> 
    <div class="box"></div> 
    <div class="box"></div> 
    <div class="box"></div> 
    ... 
    .. 
    . 
</div> 

我不希望用戶必須等待10-100高分辨率圖像和內容的.box裏面加載，所以我想弄清楚，只加載哪些用戶可以看到的最好方式並隨着用戶的滾動繼續加載。

任何人都可以指出我在正確的方向完成這個最好的方法嗎？

Answer 1

你可以捕捉滾動事件，然後找出哪些元素是可見的，加載圖像，然後

Answer 2

http://jscroll.com/

無限滾動似乎是最好的選擇。像tumblr這樣的網站使用它可以在一個頁面中擁有大量的內容，但沒有大量的加載時間。數據僅在用戶滾動到頁面底部時加載。

Answer 3

如前所述，無限滾動似乎是一個很好的選擇來解決您的問題。 這是一個很棒的網站，有一些演示和一些你可以查找的代碼。第一個演示似乎是酷似你的網站：

http://www.jquery4u.com/tutorials/jquery-infinite-scrolling-demos/

好運。