凄い!jQueryでリボンメニューを実現する「jQuery Ribbon」
MS Office 2007から採用されたリボンメニュー。今は(といっても2年前からあるが)まだ違和感があるかも知れないが、徐々にリボンメニューを採用したソフトウェアも増えており、慣れると使いやすさは向上していることに気づくはずだ。
jQueryで実現するリボンメニュー!
そんなリボンメニューをブラウザで使える、そんなライブラリがjQuery Ribbonだ。
今回紹介するオープンソース・ソフトウェアはjQuery Ribbon、jQueryでリボンメニューインタフェースを提供するソフトウェアだ。
jQuery RibbonはjQueryを使ってあのリボンメニュー風インタフェースを実現する。凄いのは全てのインタフェースがリスト(ulタグ)だけで実現されていることだろう。そのためJavaScriptがオフであっても機能はするはずだ。
メニュー
リボンインタフェースはもちろん、左上にはツリーメニューを表示することもできる。大きなアイコンと文字による説明があるので、分かりやすい操作性を提供できるのではないだろうか。
各アクションはリンクで呼び出すようになっているので、Ajaxを使えばWebアプリケーションとしての利用も簡単にできるはずだ。altキーを押すと数字が出るのだが(アクセスキー機能)、Mac OSXではこの後のアクションが分からなかった(SafariまたはFirefox3)。
リボンメニュー内に小さなアイコンを配置したり、チェックボックスを付けることもできる。さらに小さなメニューを付けることもできる。これはかなり汎用性が高く、便利に使えるのではないだろうか。テーマ機能で見た目を変更する機能もある。
Webブラウザではまだまだリボンメニューは一般的ではない。そのため、ブラウザのウィンドウに通常のメニューが並ぶのに加えると違和感が少ないかも知れない。WebアプリケーションにとってはjQuery Ribbonはかなり使えるライブラリになりそうだ。
2016年05月17日:本文修正
テーマを変更した例
via これは注目!jQueryでExtばりにリッチなUIが実装できる「jQuery Ribbon」 [phpspot開発日誌]
jQuery Ribbon - Home