當頁面內容被操縱時停止javascript閃爍？

當我製作具有操作頁面的javascript的網站時，這種操作發生在頁面加載時，我經常會遇到令人討厭的閃爍效果。當頁面內容被操縱時停止javascript閃爍？

例如，如果我有一個手風琴，完整的內容將需要加載爲html，然後一旦加載它可以用javascript包裝。這意味着一段時間內可以看到全部內容，然後它會「閃爍」，因爲其中一些內容被隱藏起來。

一個解決方案是用CSS隱藏任何閃爍的內容，然後用javascript顯示它（必要時）。問題是，那麼頁面將無法正常工作，沒有JavaScript的人。

有沒有更好的方法？謝謝

2011-06-28 Evans

你正在使用什麼事件來初始化你的JavaScript？它是否加載？ – rciq

我覺得正常的做法，這是儘快添加一個「JS」類的身體儘可能：

<!doctype html> 
... 
<body> 
<script>document.body.className='js';</script>

你會再採取一些CSS規則，以確保內容被隱藏在JS可用，就像是。

.js .accordion:nth-child(n+1) { display: none }

來源

2011-06-28 11:12:35 searlea

這絕對是最好的解決方案。 jQuery的ready函數等待DOM完全準備好。如果你想快速執行一個元素，那麼這是我想要的方式。 –

一個不錯的方法是使用document ready function in Jquery。

來源

2011-06-28 11:09:39

退房this excellent article保羅愛爾蘭 - 它基本上是你所描述的方法的反轉，用CSS隱藏，直到JS負荷。通過將<script>document.documentElement.className += 'js';</script>添加到頭部，您基本上可以獲得在DOM準備好之前隱藏未格式化內容的好處，並且對於沒有使用Javascript的用戶也不會搞砸。

來源

2011-06-28 11:12:39

如果您在頁面加載後更改css屬性，將發生這種閃爍。最好的方式來使CSS具有JavaScript處理它的相同的屬性。通過這種方式，您還可以通過在瀏覽器中跳過額外的迴流/重繪來使頁面更高效。然而，黑客應該已經將JavaScript最小化並在你的css載入行之前加載它。

來源

2011-06-28 11:13:25

-1

沒有更好的方法來做到這一點，使用漸進式增強。在某些時候，您將需要加載整個頁面，然後使用JavaScript來隱藏您不想看到的內容。但是，因爲JavaScript只能在DOM寫完後才能執行，所以必須先等待它被寫入，然後才能隱藏它。這似乎違反直覺，但你去了。這是我們支付操縱DOM的價格:-)

來源

2011-06-28 11:13:25 Alex

甚至可以在DOM完全準備好之前執行JS。 Searlea的答案如下。 –

當頁面內容被操縱時停止javascript閃爍？

回答

相關問題