Cookieでユーザー指定の背景色とフォント色／フォントサイズを記録
●このクッキーは「Cookieの削除」ページで削除できます。
Sample Source......................................................................>>>
<SCRIPT language="JavaScript">
<!--
function setCookie(key,value){ //Cookieﾌｧｲﾙにﾃﾞｰﾀを書き込む
temp=key+"="+escape(value)+";"; //Cookieのｷｰ名とｴﾝｺｰﾄﾞされたその値
temp+="expires=Tue,1-Jan-2002 00:00:00;"; //Cookieの有効期限
document.cookie=temp; //Cookieを設定(Cookieﾌｧｲﾙに書き込む)
}
function getCookie(key){ //Cookieﾌｧｲﾙからﾃﾞ-ﾀを読み出す
temp=document.cookie+";"; //Cookieﾌｧｲﾙの全ﾃﾞｰﾀを変数tempに入れる
//上のﾃﾞｰﾀ内に引数keyの文字列が存在するかを検索し、あった場合その先頭位置を返す
i=temp.indexOf(key,0);
if(i!=-1){ //引数keyの文字列が存在した場合
//引数keyに対応する値の先頭位置を調べる。(keyの先頭位置)+(keyの文字列数)+1
i+=(key.length+1);
j=temp.indexOf(";",i); //引数keyに対応する値の末尾位置を調べる
value=temp.substring(i,j);//引数keyに対応する値を取り出す
return(unescape(value)); //値をﾃﾞｺｰﾄﾞして返す
}
return(""); //引数keyの文字列が存在しない場合(初回ｱｸｾｽ時)、空文字""を返す
}
function InitCookie(){ //ﾍﾟｰｼﾞ読み込み時、Cookieﾌｧｲﾙから設定ﾃﾞｰﾀを取得
bgc = getCookie("bgcolor"); //背景色
if(bgc != "")document.bgColor = bgc;
fgc = getCookie("fgcolor"); //文字色
if(fgc != "")document.fgColor = fgc;
fs = getCookie("fontsize"); //ﾌｫﾝﾄｻｲｽﾞ
if(fs != "")document.body.style.fontSize = fs + "pt";
}
function BGColorSet(bgc){
setCookie("bgcolor",bgc); //選択した背景色をCookieﾌｧｲﾙに保存
document.bgColor = bgc;
}
function FGColorSet(fgc){
setCookie("fgcolor",fgc); //選択した文字色をCookieﾌｧｲﾙに保存
document.fgColor = fgc;
}
function FontSizeSet(fs){
setCookie("fontsize",fs); //選択したﾌｫﾝtｻｲｽﾞをCookieﾌｧｲﾙに保存
document.body.style.fontSize = fs + "pt";
}
//-->
</SCRIPT>
</head>
<body onload="InitCookie()">
<form name="form1">
<div>■あなた好みの背景色を選択してください。次回から自動的にこのページに反映されます。<br>
<input type="button" style="background-color:peachpuff" value="peachpuff" onclick="BGColorSet(this.value)">
<input type="button" style="background-color:lightgrey" value="lightgrey" onclick="BGColorSet(this.value)">
<input type="button" style="background-color:skyblue" value="skyblue" onclick="BGColorSet(this.value)">
<input type="button" style="background-color:darkseagreen" value="darkseagreen" onclick="BGColorSet(this.value)">
<input type="button" style="background-color:tan" value="tan" onclick="BGColorSet(this.value)">
<input type="button" style="background-color:lightpink" value="lightpink" onclick="BGColorSet(this.value)">
<input type="button" style="background-color:plum" value="plum" onclick="BGColorSet(this.value)">
</div>
<div>■あなた好みの文字色を選択してください。次回から自動的にこのページに反映されます。<br>
<input type="button" style="background-color:black" value="black" onclick="FGColorSet(this.value)">
<input type="button" style="background-color:navy" value="navy" onclick="FGColorSet(this.value)">
<input type="button" style="background-color:darkgreen" value="darkgreen" onclick="FGColorSet(this.value)">
<input type="button" style="background-color:maroon" value="maroon" onclick="FGColorSet(this.value)">
<input type="button" style="background-color:red" value="red" onclick="FGColorSet(this.value)">
<input type="button" style="background-color:purple" value="purple" onclick="FGColorSet(this.value)">
<input type="button" style="background-color:darkslategray" value="darkslategray" onclick="FGColorSet(this.value)">
</div>
<div>■あなた好みのフォントサイズを選択してください。次回から自動的にこのページに反映されます。<br>
<input type="radio" name="f_size" value="9" onclick="FontSizeSet(9);"> 9pt
<input type="radio" name="f_size" value="10" onclick="FontSizeSet(10);"> 10pt
<input type="radio" name="f_size" value="11" onclick="FontSizeSet(11);"> 11pt
<input type="radio" name="f_size" value="12" onclick="FontSizeSet(12);"> 12pt
<input type="radio" name="f_size" value="13" onclick="FontSizeSet(13);"> 13pt
<input type="radio" name="f_size" value="14" onclick="FontSizeSet(14);"> 14pt
<input type="radio" name="f_size" value="15" onclick="FontSizeSet(15);"> 15pt
<input type="radio" name="f_size" value="16" onclick="FontSizeSet(16);"> 16pt
</div>
</form>