標籤：blog 需要 images html 結構 http 網路 介面切換 效果
近期需要整理後台系統的介面皮膚樣式。就是看一種風格樣式習慣了，想換點別的樣式介面
思考了一段時間，開始想偏了，想直接在現有樣式直接修改。比如：紅色，綠色。
思考後，還是寫兩套皮膚樣式，進行切換吧。
預設載入原有的樣式檔案，點擊按鈕，切換對應的即可。不必修改結構，直接修改不同的樣式屬性。
以下為 核心程式碼片段
<link id="skinStyle" href="../styles/style.css" type="text/css" rel="stylesheet" />
</head>
<script>
$(function() {
var oSkinStyle = $("#skinStyle");
var aSkin = $("#skin > li");
var arr = ["../styles/style.css", "../styles/style-black.css"];
for(var i = 0; i < aSkin.length; i++) {
(function(index) {
aSkin.eq(index).on("click", function() {
oSkinStyle.attr("href", arr[index]);
});
})(i);
}
});
</script>
<body>
<ul id="skin">
<li id="red" title="紅色" class="current">紅</li>
<li id="black" title="黑色" class="">黑</li>
</ul>
</BODY>
</HTML>
預設載入原有的style.css。當點擊按鈕切換，進行選擇style-black.css即可
參考網路資源：http://fgm.cc/learn/lesson1/02.html
多謝lost，陽仔完善……
http://files.cnblogs.com/files/leshao/skin-peeler.rar
網頁換膚效果 系統介面切換皮膚樣式
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
