jquery樣式表切換器 - 如何只影響主題的CSS？

我正在使用我發現的jQuery樣式表切換器的代碼。jquery樣式表切換器 - 如何只影響主題的CSS？

從這裏：http://www.cssnewbie.com/simple-jquery-stylesheet-switcher/

現在我遇到一個問題，使用該切換器。

我想我們這加載一個主題的CSS文件，同時保持我的主要CSS文件加載。

我的主要CSS文件包含我的網站結構，我想保持這個文件加載，不管是什麼。

現在我正在嘗試使用此切換器爲網站加載備用顏色主題。唯一的問題是，我的主要CSS文件正在卸載並由顏色主題取代。

我怎麼能有一個主要的css文件沒有改變，並讓這個切換器隻影響我的主題css文件？

感謝

來源

2011-01-11 Adam

該文章中的第一個腳本替換樣式表中所有<link>元素。您需要指定要更改哪個<link>（如該文章中使用類區分的第二個例子）。

例如：

<link rel="stylesheet" type="text/css" href="main.css" /> 
<link class="theme" rel="stylesheet" type="text/css" href="theme1.css" /> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript" src="jquery.cookie.js"></script> 
<script type="text/javascript"> 
if($.cookie("css")) { 
    $("link.theme").attr("href",$.cookie("css")); 
} 
$(document).ready(function() { 
    $("#nav li a").click(function() { 
     $("link.theme").attr("href",$(this).attr('rel')); 
     $.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'}); 
     return false; 
    }); 
}); 
</script>

來源

2011-01-11 16:06:19 bdukes

您想要在節點上使用備用屬性。不要改變周圍的hrefs。看到我的答案。 – JohnO 2011-01-11 16:36:15

您需要更改樣式表切換器的JavaScript文件/代碼和標記位

包括在HTML文件中的部分，這些線

<link rel="stylesheet" type="text/css" href="main-stylesheet.css"/> 
<link rel="stylesheet" type="text/css" id="alt_style" href=""/>

用你的主樣式表替換main-stylesheet.css。另一個空鏈接標籤將用於替代樣式表。改爲使用這個Javascript功能：

$(document).ready(function() { 
    $("#nav li a").click(function() { 
     $("link#alt_style").attr("href",$(this).attr('rel')); 
     return false; 
    }); 
});

這應該是個訣竅。 :)

來源

2011-01-11 16:08:51 aakashbhowmick

樣式表以默認方式執行此操作。所以你不想從dom中添加/刪除樣式節點，或者搞亂href。這種默認的方式是rel =「alternate stylesheet」。任何與「替代」的東西都是由客戶端下載的，而不是應用的。所有的瀏覽器都支持這一點，並且它已經在很長一段時間了。

您可以添加一個類或其他html屬性（我已經使用group =「foo」，group =「bar」）來表示只能應用一個樣式表的邏輯分組。關閉樣式表的方法是將樣式表節點的disabled屬性更改爲「true」。打開它的方法是disabled = False。不要在rel屬性中更改「alternate」。

來源

2011-01-11 16:35:15 JohnO

我在http://jsfiddle.net/dQBQ3/嘗試了這種方法（如果我能使它工作，我同意這是更好的方法），但沒有任何運氣。有什麼想法可能是錯誤的嗎？ – bdukes 2011-01-11 16:53:13

jquery樣式表切換器 - 如何只影響主題的CSS？

回答

相關問題