|
|
||||||||
らくなび:サンプルコード | − 具体的なコード例 |
■ らくなび:サンプルHTML
下記のようにHTMLにスクリプトの指定を追加して下さい。
【らくなび:サンプルコード】 <html> <body> <script language="javascript" src="keynavi_raku_ja.js"></script> <script language="javascript" src="keynavi_ja.js"></script> 。。。。。 </body> </html> 注意点として、keynavi_raku_ja.jsの指定は<body>タグの直後にします。 keynavi_ja.jsについては後ろの方でも構いません。 上記指定により 括弧キーによる拡大や自動ナビなどが使用可能になります。
メモ:
拡大操作をキー入力ではなくリンククリックなどマウス操作で行いたい場合は
関数「kl_zoom_set(倍率を実数指定)」を呼びます。
■ 矢印キーでフォーカス移動を可能にするには
フォーカスを「矢印キー」で行えるようにするにはスクリプトで
「KL_MAP_FAC=1」とします。
これにより「矢印キー」入力がスクロールになるかフォーカスになるか
「CTRL」キーで切替えられます。
或いは「KL_MAP_DEFAULT="mapac_fci_fai_fca_fac";」とすると デフォルトでこのモードが有効になります。 上述の場合と異なりこの機能が不要な場合は 「Ctrl-/」で「設定画面」を表示させて無効に切替えられます。 ■ フォーカス位置を分かりやすく
スタイルシートで「a:focus/active」の指定を追加します。
【フォーカス対象を赤色にするスタイルシート指定例】 a:active { color:red !important; } a:focus { color:red !important; } a:active * { color:red !important; } a:focus * { color:red !important; } a:active * * { color:red !important; } a:focus * * { color:red !important; } a:link img { border:2px solid #0000FF !important; } a:visited img { border:2px solid #A000F0 !important; } a:active img { border:2px solid red !important; } a:focus img { border:2px solid red !important; } 上記コードによりフォーカス対象のテキストや画像の枠が赤色になります。
メモ:
HTMLを手入力するなど上記指定をHTML毎に書き足すのが面倒な場合は
keynavi,rakunaviやスタイルシートの指定全てを
1つの外部JavaScriptファイルにまとめてしまいます。
すると各HTMLには一行追加するのみで済みます。
|