サンプルHTML▼
http://htmldwarf.hanameiro.net/tools/FontSizeChange_sample.html
JSファイル▼
http://htmldwarf.hanameiro.net/tools/FontSizeChange.js
Cookieを利用して、選択した文字サイズは次回訪問時や同フォルダ内で同じスクリプトを設置したページにも適用します。
サンプルでは小＝90％、中＝100％、大＝115％で、[小][中][大]のテキストリンク、選択中のサイズは赤、未選択のサイズは青という設定ですが、
・ボタンのタイプ（テキストor画像）
・テキストの表記と配色
・大中小それぞれに対応する文字サイズ
が選択できるようになっています。
あ、画像にする場合はボタンは自分で作ってください。（正式配布の際にはボタンも作って同梱したいですが）
設置方法は
１）JSファイルの設定を自分好みに調整する。
２）小説ファイル内の、ボタンを置きたい場所に <script type="text/javascript" src="FontiSizeChange.js"></script>
と記入。
３）小説ファイルのbodyタグ内に onload="SizeChange();" と記入。
JSファイル内に設置方法の解説があるので、ローカル保存してテキストエディタで開いてみてください。
設置の際はサンプルのソースも参考にしてくださいね。
同じ機能を持つスクリプトがたくさん配布されているでしょうが、リクエストいただいちゃったので、出来心でつくってみました。中身は先日サイトで本公開したDesignChangerをちょろちょろアレンジしただけです。
【小説サイトを読みやすくしよう】というサイトさんで同様のものが以前配布されていた記憶があり、こちらを紹介しようとアクセスしてみたのですが、2006年に閉鎖なさっていたのですね。
遅くなりましたが、お疲れ様でした。
とありますが、大中小をテキストの代わりに、画像に変更する方法を教えていただけますでしょうか？
返信遅くなって失礼しました。
画像ボタンを使うには、FontSizeChange.jsの60行目を
ButtonType = 1;
と変更し、画像を６個用意してください。（小中大とその選択中バージョン）
画像ファイルの名づけルールは以下の通りです。
通常…small.gif、medium.gif、large.gif
選択中…small_on.gif、medium_on.gif、large_on.gif
画像は本文のHTMLファイル、JSファイルと同階層に置いてください。
この度、利用させていただいたのですが、
画像を使った場合、中のサイズのときに、オン表示されないようです。解決策はあるのでしょうか？？
（つまり、中を選んでも、画像が切り替わらない）
お手数ですが、お知恵をお貸し頂けないでしょうか。
画像ボタンタイプのサンプルをアップしました。
http://htmldwarf.hanameiro.net/tools/FontSizeChange_sample2.html
こちらでは中サイズでもオン表示になりますので、スクリプトの問題ではないようです。
画像指定が正しいかなど、今一度ご確認いただけますか？
＃最初にアクセスしたとき（サイズを選ぶ前）は表示サイズは中であってもボタンの「中」はオンになりません。これはテキストリンクのタイプでも同様です。
検証ありがとうございます。
拝見させていただきました。
それで、こちらでもどうしてかいろいろと実験してみた結果、
どうやら、中のサイズの値を62.5と"点"が入っていることが原因みたいです。
これはどうにもならないものなのでしょうか？
もし解決策があれば、教えてください。
なんども厚かましいお願いをして申し訳ありません。
よろしくお願い致します。
FontSizeChange.jsの132行目
if (Cookie.match(/FontSize=(\d*)/)) {
を
if (Cookie.match(/FontSize=([\d.]*)/)) {
と書き換えてみてください。
近日中に修正版もアップいたしますが、取り急ぎ。
いただきました。
スタイルシートでフォントサイズをピクセル指定しても大きさを変えたいのですが、方法を教えていただけますでしょうか？
何卒宜しくお願い致します。
ひとつ要望なのですが、文字サイズを変更した場合、同時に行間を変更させるようできないでしょうか？
自分はフォントサイズ12px、行間18pxをデフォルトサイズにしていますが、
現状では小サイズ (10px)、大サイズ (15px) に変更しても行間は18pxで固定された状態です。
お時間のある時にでもご回答いただけると助かります。
よろしくお願いします。