風格消失網頁上的時刻刷新

這是一個簡單的HTML頁面，我使用了以下功能改變上按一下按鈕樣式表（深色和淺色主題之間切換）：風格消失網頁上的時刻刷新

function setDarkTheme() { 
 
\t \t \t document.getElementById('style1').href = "css/Dark.css"; 
 
\t \t \t document.getElementById('style2').href = "css/skins/skin-dark.css"; 
 
\t \t } 
 
\t \t 
 
\t function setDefaultTheme() { 
 
\t \t \t document.getElementById('style1').href = "css/Light.css"; 
 
\t \t \t document.getElementById('style2').href = "css/skins/skin-light.css"; 
 
\t \t }

此外，當前主題值正在保存在瀏覽器本地存儲中，該頁面在jquery ready函數之外進行檢查，以在頁面加載之前（每當用戶返回該站點時）設置樣式表。

這個問題（在Chrome和Firefox上）是，當用戶切換到黑暗的主題，並刷新頁面，造型消失一秒鐘，然後回來。如果用戶切換回光/默認主題，並刷新頁面，它工作正常，沒有任何毛刺。 style-sheet的默認href值被設置爲html頁面中的light主題。

有什麼辦法擺脫那個毛刺？任何建議都會很棒。

來源

2017-08-16 Ammad Ahmed

檢查n在窗口加載時加載已保存的主題 – Rex

'＃style1'，'＃style2'的默認屬性是什麼？ – donnikitos

如果我在加載時執行此操作，它會提供默認主題的Flash。我不想那樣。 –

由於<link />標籤的缺省值是缺省加載的light主題的* .css文件，無論您是否更改ready的值。 ready表示頁面已經加載。並且首先加載每個頁面的。

的建議是，要離開<link />標籤空白在你的HTML的值，僅裝入準備頁面上的正確* .css文件。

來源

2017-08-16 06:46:47 donnikitos

我試過你的方式，但現在它給兩個主題的故障。 –

然後我也建議你先隱藏所有東西，然後在頁面加載時顯示它，只是爲了掩蓋故障 – donnikitos

@johnny也嘗試使用不是'jQuery.ready（）'事件，而是'window.onload = function（）{};'事件，可能會這樣做 – donnikitos

風格消失網頁上的時刻刷新

回答

相關問題