これまでの、チェックボックスをONにすると、その内容を表示させるという方式から、プルダウンリストで項目を選択すると、表示領域にヘルプの内容が表示されるように変更した。本当はタブボタン風にしようと思ったのだけれど、項目名が長くなったりすると横幅が溢れてしまうのでこうなった。機能的には満足だけど、デザイン的にはどうにも…。
作りはすべてCSSでやる方法もあったけれど、あえてJavaScriptを使う事にした。CSSでやるとヘルプの項目を追加する度にCSSにもクラスを登録しなくてはならなさそうだったので。実際は違うやり方もあったかもしれないけれど、現行のやり方(ターゲットのIDをdatasetで引き渡し、jQueryでそれ以外のページを非表示にした後、該当ページのみ表示させる)で行くことにした。プログラマの私としては、こっちの方がわかりやすい(笑)。
後、細かなマージンの指定を直接タグにstyleで指定してしまっている。本来ならちゃんとstyle.cssに書くべきなんだろうけど、WordPressのテーマとの優先度などで悩むのも面倒くさいので今はこれで逃げる事にした。まぁいいだろう。
ヘルプの方式変更とともに、先日追加したアビリティの種別アイコンについての説明を追記した。これはこれで十分だろう。
後予定しているのは、一部SRキャラの追加と、ボタン系のスタイル見直し。できれば今週中に終えて運用サイトへ反映させたい。