ax5ui-menuはカスタマイズしやすいシンプルなコンテキストメニューを実装できます。jQuery、ax5core、Bootstrapが使用されているとのこと。テーマもいくつか用意されていて、どれもシンプルなデザインで飽きがなく、いろんなサイトに合わせやすそうですね。
ax5ui-menu
以下、ax5ui-menuの実際のデモページになります。
デモでは「Right click on the mouse.」と書かれた領域内で右クリックをすると、ax5ui-menuによって作られたコンテキストメニューが表示されます。Menu AとMenu Bというメニューリストが表示され、さらに両方とも子メニューを持っています。入れ子になっていて、各メニューにマウスオーバーすると下の階層のメニューが表示される仕組みです。
こちらはContext Menuのデモですが、他にもチェックボックスが付いたものやアイコンが付いたもの、テーマを変更できるものなどいろんなパターンのデモが用意されています。
ちなみにThemeのデモでは、default、Primary、info、warning、dangerの中から好きなテーマを選択して見ることが可能です。
実装面ではitemsの中にメニューを入れていきます。表示させるメニュー名はlabelに指定し、子リストを設定したい場合はitems内にさらにitemsを入れていくかたちです。
実際のコードの記述例はデモページに載っているので、詳しく知りたい人はぜひチェックしてみてください。
というわけで、シンプルなデザインでカスタマイズもしやすいコンテキストメニューを実装できる「ax5ui-menu」の紹介でした。ax5ui-menuの詳細やダウンロードは、以下のページからどうぞ。
