再読み込みしないでCSSを書き換えたい
-
0 名前: めぐ : 2006/04/10 12:21
- 過去記事から見当たらなかったので、質問させてください。
あるindex.htmlにstyle1.cssとstyle2.cssという2枚のCSSファイルを用意しています。
通常はstyle1でレイアウトをしているんですが、
画面上のボタンを押したときに、style2のcssに書き換える仕様で制作していました。
今までの方法は、ボタン押の値をCookieに保管してreload。
ページを表示するときにその値を見てcssファイルの判別をしていました。
ただこれだとどうしても表示に時間が掛かってしまうので、
もし単純にCSSを書き換える方法があれば、どなたか教えてください。
-
1 名前: Pid : 2006/04/10 12:21
- 軽くということなら JavaScript を使うことになります。
<link rel="stylesheet" type="text/css" href="style1.css">
<link rel="stylesheet" type="text/css" href="style2.css">
で関連付けておけば
・document.styleSheets[0]
・document.styleSheets[1]
のようにスタイル情報が格納されますので,
・document.styleSheets[0].disabled = true; // style1.css を無効
・document.styleSheets[1].disabled = true; // style2.css を無効
のようにして切り替えることができます。MSIE,Mozilla/Firefox は対応しています。ただ,Safari 1.x は読み取り専用なのと,Opera 8 以下が対応していないので,全体としてはかなりの工夫が必要です。
スタイルシート切替スクリプトはいろいろ配布されていますので,探してみて下さい。
-
2 名前: めぐ : 2006/04/10 12:21
- 返事が遅くなってスミマセン!
Pidさんのアドバイスを元にやってみたところ、
無事に解決できそうです。
本当にありがとうございました。