The Cusp of Helix

Territory of CSS
[Keyboard]

特色

ソースコードを見ると分かりますが、キーを表示するためのタグは、キーひとつにつき一個だけ使われています。abc|ABC|かな|カナの切り替えによりキーの文字が変わりますが、切り替わる文字は CSS で実装しています。

フラット配列と Qerty 配列の切り替えでキーの位置が移動しますが、その処理を CSS で実装しています。キーを移動したり文字を変えるために余分なタグが追加されてないので、デザインを適用する際に指定漏れなどの心配がありません。

フレキシブルデザインで実装されています。ウインドウサイズを変えてみると、その幅に合わせてキーサイズが変化するのが分かります。任意のサイズで表示できるメリットは大きいでしょう。

ライブラリとしての活用

このキーボードの CSS ファイルは、必要部分をライブラリ化して GitHub で公開する予定です。現時点で CSS ファイルから切り出して使う場合は、MIT ライセンス準拠で使っていただけます。

キーボードとして機能させるには、キーイベント処理を Javascript で追加する必要がありますが、イベントを仕込むタグはひとつだけで済む方法があります。全キーにイベント処理を指定する方法もありますが、ひとつだけの方が断然スマートです。jQuery のような大物ライブラリを使わなくても、キーイベントは簡潔に実装できるという訳です。

「このキーボードを自分のサイトで使ってみたいけど、実装方法が分からない」という場合は、最寄りの Stew Eucen までご連絡下さい。簡単なアドバイス程度なら可能だと思います。

キーボードとして動作する完全な実装をご希望の場合は、正式に発注していただければ勉強された予算で作成いたします。