Vertical Fixed Navigation #2

JavaScript

サイド表示で見やすくて操作もしやすい縦型ナビゲーション「Vertical Fixed Navigation #2」

Vertical Fixed Navigation #2はサイドに表示される縦型ナビゲーションです。固定されているのでスクロールしても好きな場所から瞬時にアクセスできます。シンプルで見やすいうえに操作性にも優れています。

Vertical Fixed Navigation #2

デモ

右側に表示されたドットにホバーするとアイコンが表示されます。ドットだけではどんなメニューかわかりませんでしたが、アイコンつきのメニューなら内容も把握しやすいですね。

ホバー時のエフェクトは、右からスライド表示されるとともに、ドットが拡大しながらアイコンへと変化していきます。違和感なくスムーズな動作がとても快適です。

アイコンに切り替わることでクリックもしやすくなりますね。また、必要なときだけアイコンつきナビゲーションが表示され、それ以外はドットが表示されているだけというシンプルなデザインなので、コンテンツにも集中しやすいと思います。

縦型ナビゲーションということで、縦に長いページとの相性は抜群です。ランディングページをつくる際にも役立つのではないでしょうか。

というわけで、固定された縦型ナビゲーション「Vertical Fixed Navigation #2」のご紹介でした。

Vertical Fixed Navigation #2

関連記事

  1. intence

    JavaScript

    インタラクティブなナビゲーションスクロールバーのJSライブラリ「intence」

    intenceはスクロール中のエリアが分かるインタラクティブなナビゲー…

  2. jQuery toTop()

    JavaScript

    シンプル・軽量でカスタマイズもできる滑らかなスクロール「jQuery toTop()」

    jQuery toTop()はトップへ行くための滑らかなスクロールを実…

  3. no-image

    JavaScript

    高さを揃えたレスポンシブな画像ギャラリー「jQuery Mosaic plugin」

    jQuery Mosaic pluginは高さを揃えたレスポンシブな画…

  4. CollagePlus

    JavaScript

    画像を綺麗に整列させるjQueryプラグイン「CollagePlus」

    画像を綺麗に整列させる便利なjQueryプラグイン「CollagePl…

  5. jQuery Accordion

    JavaScript

    シンプルで実用的なアコーディオン実装「jQuery Accordion」

    とてもシンプルで操作性のよいアコーディオン「jQuery Accord…

  6. Multi-Level Menu

    JavaScript

    流れるような遅延アニメーションが美しい階層化メニュー実装「Multi-Level Menu」

    Multi-Level Menuは流れるような遅延アニメーションが美し…

最近の記事

  1. macOS Mojaveのダークモード
  2. Olli
  3. 単語帳メーカー(Flashcard Maker App)
  4. 1Password 7

Facebookページ

PAGE TOP