2011-07-05 58 views
3

我正在製作投資組合網站,並有一個橫向滑塊,它將在每件作品之間滑動。假設有100件作品,它們都是圖形密集型和/或閃光對象。瀏覽器性能顯示/知名度

我們還假設任何時候屏幕上最多會有4件作品。

他們都在一個大的div,我操縱jQuery修改left財產移動div

在高端機器上,它可以很好地運行,但是例如上網本,它真的很不穩定......甚至在較慢的瀏覽器上。

我打算做的是制定出哪些作品在他們轉換並僅顯示它們時可見。我希望這會提高性能。但是,我計劃將visibility屬性設置爲hidden,因此元素尺寸仍然存在。但是,我想知道將display設置爲none並創建一個佔位符元素而不是隱藏工作會更好嗎?

還有哪些方法可以提高較慢機器/瀏覽器的性能?

回答

2

從製作display:none;之後,您不會獲得任何可觀的性能提升。內容仍將被加載。

相反,你可以嘗試看看一些AJAX。一個想法是預加載8個項目,即使你只顯示4.然後在用戶點擊「下一個」按鈕,屏幕滑動到下一個4個已經加載的項目,同時該行中的下4個項目將開始加載。

http://yensdesign.com/2008/12/how-to-load-content-via-ajax-in-jquery/

+1

但最終,如果用戶滑動全部通過投資組合,所有的100個項目將被載入......除非你認爲我刪除元素他們拿出來看後,再與阿賈克斯重裝?這將成爲服務器性能的熱門 – Ozzy

+0

您獲得的是更快的頁面加載時間。當用戶在頁面上有100個項目時,滾動時問題將會滯後。除此之外,沒有關係 - 除非你提到,否則刪除早期的項目。 – Steeven

+0

它不會像您想象的那麼大的服務器性能要求。這些項目的編號將從#1到#100,並且只會刪除過去的四個項目。儘管如此,在同一頁面上顯示100個圖形項目並不是非常值得推薦的。一個替代方案可能是顯示10個20個項目,然後當用戶到達最後時會顯示一個「顯示更多」-botton。 – Steeven

相關問題