導航:首頁 > 編程語言 > jscss切換樣式表實現網頁換膚

jscss切換樣式表實現網頁換膚

發布時間:2025-04-24 06:23:09

『壹』 jsp頁面如何實現整體換膚

給個皮膚編號,選擇下來框的時候每個option的值對應到皮膚編號,登錄過後根據上傳過來的值反顯皮膚,如果用戶登錄的時候需要記錄上一次確定過的皮膚,就將皮膚編號存到資料庫

『貳』 求一個CSS代碼 可以改字體顏色 背景圖片 把標題欄弄透明的 謝謝了~

你指的是網頁換皮膚吧。

從網上下載一個jquery 庫 jquery-1.9.0.min.js 不一定是1.9的,可以是1.2至1.9都行

新建兩個不同名稱文件夾,存放兩個樣式表和圖片。如:color1 和color2

兩個樣式表的樣式名要完全一樣,大部分樣式一模一樣,圖片名稱和存放地址也一樣,不一樣的是圖片不一樣,字體顏色樣式不一樣。

兩個樣式存放地址分別:color1/css/index.css和color2/css/index.css

index.html 和color1、color2 為同一目錄的文件

看下面的代碼你應該能明白。


樣式文件color1

.color_style{width:300px;height:30px;line-height:30px;font-size:20px;font-weight:bold;background:url(color1/image/img.gif)no-repeat;color:#fff;background-color:#999;}

樣式文件color2

.color_style{width:300px;height:30px;line-height:30px;font-size:20px;font-weight:bold;background:url(color2/image/img.gif)no-repeat;color:#ff00ff;background-color:#9C3;}
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>換膚</title>
<linkhref="color1/css/index.css"rel="stylesheet"type="text/css"id="color_style"/>
<scriptsrc="js/jquery-1.9.0.min.js"type="text/javascript"></script>
<scripttype="text/javascript">
$(function(){
functionchange_color(){
varhref1='color1/css/index.css';
varhref2='color2/css/index.css';
varlink_url=$("#color_style").attr("href");
if(link_url==href1){
$("#color_style").attr("href",href2);
}else{
$("#color_style").attr("href",href1);
}
}
$("#change").bind("click",change_color);
});
</script>
</head>
<body>
<divclass="color_style"><spanstyle="float:left;">這是效果標題</span><spanstyle="float:right;cursor:pointer;"id="change">點擊換膚</span></div>
</body>
</html>

『叄』 如何用js改變多個框架的css,也就是讓網頁整體換膚

<linkhref="css/color1.css"id="color"rel="stylesheet"type="text/css"/><!--注意這行的id-->
<aonclick="changeStyle(1)">樣式1</a>
<aonclick="changeStyle(2)">樣式2</a>


上面是html,下面是js.把選定的樣式載入進cookies ,網頁載入先查cookie。


functiongetObject(elementId){//獲取指定id的object
if(document.getElementByIdx){returndocument.getElementByIdx(elementId);}
elseif(document.all){returndocument.all[elementId];}
elseif(document.layers){returndocument.layers[elementId];}
}
functionchangeStyle(id){//切換樣式
varstylesheet=getObject("color").href="css/color"+id+".css";
document.cookie="stylesheet="+escape(stylesheet);//寫入Cookie
//alert(document.cookie);
//alert(stylesheet);
}
functioninitStyle(){//初始化樣式,如果cookie存在樣式,則載入cookie樣式,否則載入默認樣式
if(/stylesheet=([^;]+)/.test(document.cookie))//判斷是否存在cookie.
getObject("color").href=unescape(RegExp.$1);
//alert(/stylesheet=([^;]+)/.test(document.cookie));
}initStyle();
閱讀全文

與jscss切換樣式表實現網頁換膚相關的資料

熱點內容
如何用大數據做企業 瀏覽:656
復合編程用什麼軟體最好 瀏覽:505
txt轉換word 瀏覽:797
java字面值的存儲 瀏覽:261
nodejs創建文件夾錯誤 瀏覽:484
c語言編程為什麼關閉了 瀏覽:245
相冊的數據清理了怎麼恢復 瀏覽:775
微信文件管理換路徑了以前聊天記錄沒有 瀏覽:310
java字元串截取最後兩位 瀏覽:377
少兒編程和無人機編程哪個好 瀏覽:383
ensp配置文件怎麼導出 瀏覽:939
52好壓右鍵沒有壓縮文件選項 瀏覽:98
avi什麼類型的文件格式 瀏覽:418
分區表與文件系統 瀏覽:786
獲得文件夾路徑的對話框 瀏覽:179
弟子規哪個版本的好 瀏覽:423
二手蘋果6p的價格 瀏覽:111
微信公眾號版頭設計 瀏覽:917
jdk18讀取配置文件 瀏覽:72
優化關鍵字挖掘工具 瀏覽:672

友情鏈接