小説ページデザインチェンジャー DesignChanger.js

概要

小説本文の配色とレイアウトを、訪問者の好みに合わせて調整してもらうためのJavascriptです。
Cookieを利用しており、１度設定すると次回の訪問でも同じレイアウトで閲覧できます。
設定は複数のページに反映させられます。

DesignChange.lzhを解凍してください。
DesignChang.jsをエディタで開き、
```
/* ------------ 初期設定 --------------*/
```
以下の部分の値を自分の好みに変更してください。
DesignChange_sample.htmlを参考に、変更機能をつけたいページを下記のように編集してください。

<head>～</head>内に外部jsファイルへのリンクを設置（対象の全ページ）
```
<script type="text/javascript" src="DesignChange.js"></script>
```
<body>タグにレイアウト設定を読み込む関数を追加（対象の全ページ）
```
<body onload="Read()">
```
書式の指定を反映させたい要素に、初期設定で指定したIDを設定（対象の全ページ）
```
<body id="bd" onload="Read()">
	（中略）
	<div id="docs">
		小説本文
	</div>
</body>
```
※上記は初期設定のIDを使う場合の例

レイアウト変更小窓を開くボタンを設置（任意のページ）
```
<a href="DesignChange.html" target="_blank">デザイン調節</a>
```
```
<input type="button" value="デザイン調節" 
onclick="window.open('DesignChange.html','w',
'width=250,height=200,scrollbars=yes,resizable=yes')">
```
※上は通常のリンク（新しいページ）の場合、下は250×200のポップアップウィンドウの場合の例です。
DesignChange.jsとDesignChange.htmlをサーバーにアップしてください。
動作確認してください。

現在のところ、文字サイズ・左右余白・行間は％指定、配色は白～黒の16段階のグラデーションとなっています。