no-image

JavaScript

円形に広がるメニュー実装「expanding action button」

expanding action buttonは円形に広がるメニューを実装できるのが特徴です。メニューリストを表示させたい時だけボタンをクリックすればいいので、画面領域の狭いスマホなどのモバイルには最適なナビゲーションメニューといえます。

expanding action button

expanding action button

デモではスマホのようなスクリーンが表示されていて、その中の右下にある「+」ボタンをクリックするとメニューが円形に広がって表示されます。メニュー項目はテキストではなくアイコンになっているので、直感的に選択できると思います。

アニメーションも滑らかで操作性もシンプルなのが使いやすいですね。

メニューが展開されると「+」ボタンの部分が「×」に変わります。再度ここをクリックするとメニューが閉じられて元の状態に戻ります。

スマホなどといった画面のスペースをできる限り有効活用したい人には最適なメニューになりそうですね。

というわけで、円形に広がるシンプルな操作性を備えたメニューを実装できる「expanding action button」の紹介でした。

関連記事

  1. JavaScript

    2KB程の軽量&シンプルなjQueryスライダー「Craftyslide」を使ってみた

    とてもシンプルで軽量ないい感じのjQueryプラグイン「Craftys…

  2. lightGallery
  3. 2013年下半期jQueryプラグインまとめ

    JavaScript

    2013年下半期に紹介したjQueryプラグイン68選まとめ

    今年も残すところあとわずかとなりました。今年もたくさんのjQueryプ…

  4. LoadGo

    JavaScript

    画像をプログレスバー(ローディング)にできるjQueryプラグイン「LoadGo」

    LoadGoはサイト内にあるロゴなどといった画像をプログレスバー(ロー…

  5. Responsive jQuery Pop Up Gallery

最近の記事

  1. USB-2H401BKN
  2. Dyson Pure Cool Me
  3. ルック セレクション
  4. シルキーウインドモバイル

アーカイブ

PAGE TOP