MozTW 討論區

各項 Mozilla 相關軟體與技術討論
現在的時間是 2019-07-23, 07:21

所有顯示的時間為 UTC + 8 小時





發表新文章 回覆主題  [ 8 篇文章 ] 
發表人 內容
文章發表於 : 2007-08-02, 14:21 
離線
頭像

註冊時間: 2006-10-27, 07:29
文章: 1068
由於在CSS上遇到某些常見問題
因此被迫用JavaScript去偵測browser來載入不同的CSS
目前我是分為三個部分,即*.html,*.js,*.css
雖然js和css一定放在一起,但是html則否
所以問題是,要如何取得js檔自己的path,來確定css的path?

當然直接用JavaScript去更改CSS是最快,可是我不是非常喜歡這個方法....


回頂端
Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2007-08-02, 15:56 
離線

註冊時間: 2004-07-03, 22:04
文章: 444
legnaleurc 寫:
由於在CSS上遇到某些常見問題
因此被迫用JavaScript去偵測browser來載入不同的CSS
目前我是分為三個部分,即*.html,*.js,*.css
雖然js和css一定放在一起,但是html則否
所以問題是,要如何取得js檔自己的path,來確定css的path?


這個應該可以用:
http://www.howtocreate.co.uk/jslibs/swapstyle.js

好像只要把 *.css 列為 alternate 並加上 title 就可以換,然後可以用 cookie 把把換過的樣式記錄下來。

_________________
試試 Compact Menu 修改版


回頂端
Mozilla/5.0 (X11; U; Linux i686; zh-TW; rv:1.8.1.5) Gecko/20070713 Firefox/2.0.0.5
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2007-08-02, 17:24 
離線
頭像

註冊時間: 2006-10-27, 07:29
文章: 1068
它的意思是說只要設為alternate stylesheet
就可以讓這個element有disable屬性嗎?


回頂端
Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2007-08-02, 20:20 
離線

註冊時間: 2004-07-03, 22:04
文章: 444
legnaleurc 寫:
它的意思是說只要設為alternate stylesheet
就可以讓這個element有disable屬性嗎?

看起來 HTML 是沒有這個屬性,不過 DOM 有,只對 stylesheet 有效。
http://www.w3.org/TR/REC-html40/struct/ ... #edef-LINK
http://www.w3.org/TR/REC-DOM-Level-1/le ... D-35143001

_________________
試試 Compact Menu 修改版


回頂端
Mozilla/5.0 (X11; U; Linux i686; zh-TW; rv:1.8.1.5) Gecko/20070713 Firefox/2.0.0.5
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2007-08-02, 22:52 
離線
[網站管理員]
頭像

註冊時間: 2004-09-27, 09:24
文章: 1685
要用的 <link>,設成 rel="stylesheet",
暫時不要用的 <link>,設成 rel="alternate stylesheet"。
<link> 也可以指定 id,所以可以利用這一點來 manipulate 這些 <link>。
如:
<link type="text/css" id="blah1" rel="stylesheet" src="style/blah1.css" />
<link type="text/css" id="blah2" rel="alternate stylesheet" src="style/blah2.css" />
<link type="text/css" id="blah3" rel="alternate stylesheet" src="style/blah3.css" />

假如我要啟用 blah3,停用其他的樣式,用 Prototype 可以這樣寫:
代碼:
$$('link[rel="stylesheet"]').each(function(e) {
  e.rel = 'alternate stylesheet';
});
$('blah3').rel = 'stylesheet';

也可以寫成:
代碼:
Object.extend($$('link[rel="stylesheet"]'), {
  rel: 'alternate stylesheet'
});
$('blah3').rel = 'stylesheet';


或是 jQuery 寫法:
代碼:
$('link[@rel="stylesheet"]').attr('rel', 'alternate stylesheet');
$('#blah3').attr('rel', 'stylesheet');

_________________
korp + korp 中文站(沒精神更新)


回頂端
Mozilla/5.0 (Macintosh; U; Intel Mac OS X; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2007-08-03, 14:33 
離線
頭像

註冊時間: 2006-10-27, 07:29
文章: 1068
感謝,受教了

果然這樣就可以切換CSS
不過在Opera上試驗的結果怪怪的
雖然已改成alternate stylesheet,它還是不為所動
所以只好採先關閉再開啟的作法了


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2007-12-10, 00:42 
離線
[MozTW 版主群]
頭像

註冊時間: 2004-11-17, 09:53
文章: 1302
來自: 臺灣桃園
最近我也在寫這個 XD

原本是試著直接改 <link rel="stylesheet"> 的 href 屬性
缺點是:Fx 的 [檢視 > 頁面樣式] 這邊如果選了不同的樣式,其結果會是兩種樣式加在一起 XD
而且這個方法會在選第二次時,讓 IE Crash 囧"

剛才突然想起這篇,跑來看看,終於弄懂了 disabled 的用法
IE 果然再也不會出問題啦 XD 而且再也不會和 Fx 的 [頁面樣式] 衝突了

不過,在試驗的途中,我發現 Firefox 有個奇怪的問題...

無論有沒有用 JavaScript 改過樣式,甚至根本沒這段 JavaScript
當我按下 [預覽列印] 時,看到的卻是沒有樣式的頁面
而非我用 <link media="print"> 指定的列印用樣式 (以下用 print.css 代稱)
除非在我按下之前,做了以下兩件事情的其中一個:
  1. 將 print.css 同時設成 <link media="screen">,成為可選用的樣式之一
    於 [檢視>頁面樣式] 裡選擇 print.css
  2. 在 WebDeveloper 擴充套件中選擇 [CSS>依媒體顯示 CSS>Print]

做完以後,無論是否有用 JavaScript 切換到其他樣式,[預覽列印] 中都可以看到 print.css 套用後的結果
但如果做完以後用 [檢視>頁面樣式] 選了其他樣式
或者沒做以上動作,只是用 JavaScript 選擇過 print.css 樣式

...則 [預覽列印] 中依然會是沒有樣式

抱歉說得很複雜 囧" 希望大家看得懂...

_________________
在靜謐的國度裡,擁抱微風--抱風伴靜


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.1.11) Gecko/20071127 Firefox/2.0.0.11
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2007-12-10, 06:36 
離線
[MozTW 版主群]
頭像

註冊時間: 2004-11-17, 09:53
文章: 1302
來自: 臺灣桃園
後來我發現,第一種動作之所以會解決問題
其實是我忘記把 media="screen" 的那份 print.css
的 rel="stylesheet" 改成 rel="alternate stylesheet"

更正以後,這問題就只有第二種解法了 =_______="

嗯,剛才用 Opera 看了一下,它也有類似的問題...
試著在螢幕用的樣式裡加上 @import url(print.css) print; 也不行 0rz
最後,我乾脆直接用 <style>

結果 Firefox 就正常了 =_______="

_________________
在靜謐的國度裡,擁抱微風--抱風伴靜


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.1.11) Gecko/20071127 Firefox/2.0.0.11
 個人資料  
引用回覆  
顯示文章 :  排序  
發表新文章 回覆主題  [ 8 篇文章 ] 

所有顯示的時間為 UTC + 8 小時


誰在線上

正在瀏覽這個版面的使用者:沒有註冊會員 和 2 位訪客


不能 在這個版面發表主題
不能 在這個版面回覆主題
不能 在這個版面編輯您的文章
不能 在這個版面刪除您的文章
不能 在這個版面上傳附加檔案

搜尋:
前往 :  
cron
Powered by phpBB® Forum Software © phpBB Group
正體中文語系由 竹貓星球 維護製作
© moztw.org, Mozilla Foundation
MozTW,Mozilla 台灣社群