やまだ系

コンピューターやWEB関連の情報収拾と整理、資格取得に関することを目的にしたブログ

文字サイズ変更

ページ内に文字をサイズ小・サイズ中・サイズ大と表示させクリックすると変更できるというもの。これはJavaScriptを使ってCSSを変更させるということで可能。

◇ その為のテストページ
文字のサイズを変更させることのできるテストページURL


■ 参考サイト
Round and Round|スタイルシートの切り替え

手順:

  1. 文字サイズ「小」・文字サイズ「中」・文字サイズ「大」のそれぞれの文字の大きさを変更したファイルを用意しておく。
  2. 配布先サイト(英語)からstyleswitcher.jsと言うファイル名のファイル(JavaScript)をダウンロード
  3. HTMLの<head>タグ内にtyleswitcher.jsを配置する。
  4. スタイルシートもリンクさせる。※リンクの方法は紹介しているサイトで詳しく書いてあるのでそちらを参考に。
  5. HTMLもそれぞれ指定された方法でリンクさせる※リンクの方法は紹介しているサイトで詳しく書いてあるのでそちらを参考に。

めちゃ簡単に設定できた。