貯蓄のことなら太平洋

2006/05/18

むかしのひび

まあ自分で使う用に調べただけですが、おいときます。

HTMLページ表示中にスタイルシートを切り替える方法(IE6.0)
<link>タグでファイル数分のスタイルシートを指定する。その際、rel属性の値を、最初に表示するファイルはstylesheet、それ以外はalternate stylesheetにする。
JavaScriptのdocument.styleSheets配列にスタイルシートの情報が格納されているので、スクリプトで各要素のdisabled値を変更して、表示したいシートのみ有効にする。

例:
<html>
<head>
<link rel="stylesheet" type="text/css" id="aaa" href="aaa.css">
<link rel="alternate stylesheet" type="text/css" id="bbb" href="bbb.css">
<link rel="alternate stylesheet" type="text/css" id="ccc" href="ccc.css">
<script language="javascript">
<!--
function cssselect(cssid) {
    for (var i = 0; i < document.styleSheets.length; i++) {
        document.styleSheets[i].disabled = (document.styleSheets[i].id != cssid);
    }
}
// -->
</script>
</head>
<body>
<form>
<input type="button" value="AAA" onclick="cssselect('aaa');">
<input type="button" value="BBB" onclick="cssselect('bbb');">
<input type="button" value="CCC" onclick="cssselect('ccc');">
</form>
</body>
</html>

ソーシャル/購読

このブログを検索

コメント

ブログ アーカイブ