WEB制作関連

アプリのようなスライドメニューを実装するプラグイン6選

facebookのスマートホンサイトなどでも採用されているサイドからスライドして表示されるメニューを実装できるプラグインを紹介します。

ちなみにこのサイドからスライドして表示される形式のメニューはドロワーメニューと呼ばれるようです。

表示領域の限られたスマートホンサイトではドロップダウンのメニューもよく見かけますが、格納する内容が多い場合などはコンテンツ位置を固定したままスクロールできるドロワーメニューの方が相性がよさそうですね。

Sidr

drawer_01.jpg

jQuery.mmenu

drawer_02.jpg

PageSlide

drawer_03.jpg

Drawer Slide Menu

drawer_04.jpg

jPanelMenu

drawer_05.jpg

Sidebar Transitions

drawer_06.jpg

ちなみにこのブログのスマートホン版では「Sidr」を利用しています。

それぞれ動作や格納するコンテンツのマークアップの仕方などが異なるので自身のWebサイトにあったものを選んでいただくとよいかと思います。

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

関連記事

  1. WEB制作関連

    Word×Dreamweaverで高速コーディングをするワザ

    WEBサイトをコーディングする際にMicrosoftのワードで原稿をも…

  2. WEB制作関連

    やっぱり美しい!ブライダル系のWEBサイトまとめ

    素材の綺麗なサイトのデザインはやっぱり見ているだけで楽しいですが、美し…

  3. WEB制作関連

    デザイナーなら必ずダウンロードしたいグラフィティなフォント25選

    ちょっと遊んだデザインやアパレル関連などに重宝しそうなグラフィティなフ…

  4. WEB制作関連

    色とWEBデザイン -あか編-

    色別WEBデザインのまとめです。今回のテーマは「赤」です。&n…

  5. WEB制作関連

    ガーリーなPhotoshopのレイヤースタイル

    女性向けのデザインに役立ちそうなガーリーなPhotoshopのレイヤー…

  6. WEB制作関連

    ペーパープロトタイピングのすすめ

    みなさんはWEBサイトの画面設計をする時に何を利用するでしょうか。…

  1. Design Items

    紹介ムービーがカッコイイ!「魔法のハサミ」
  2. WEB制作関連

    クリエイティブな30個のロゴタイプが素敵。
  3. WEB制作関連

    404エラーページ作成のススメ
  4. ソーシャルメディア

    Twitter管理に役立つツール6選
  5. WEB制作関連

    美しい写真に目を奪われるWEBサイトまとめ
PAGE TOP
Top