個人的に役立ったデザイン素材やTips、WEBサービス、役立つグッズ、あれやこれやをご紹介

トップ固定でレスポンシブ対応のナビゲーション/メニューを簡単に実装できる「Fixed Nav」

トップ固定で、レスポンシブ対応のナビゲーションが増えていますね。
これだけ増えてくると、トップ固定のメニューが実に使いやすくなってきます。
今回はそんなトップ固定のメニューでありながら、レスポンシブにも対応したナビゲーションを簡単に実装できる「Fixed Nav」をご紹介します。

トップ固定でレスポンシブ対応のナビゲーション/メニューを簡単に実装できる「Fixed Nav」

Adtile-Fixed-Nav01
Adtile-Fixed-Nav02
Fixed Nav」は、トップ固定でレスポンシブ対応のナビゲーション/メニューを簡単に実装できるプラグインです。
jQueryは使用していません。
ページスクロールアニメーションに対応していて単ページもののサイトととっても相性がいいナビゲーションです。
ナビゲーションはアクティブにも対応していますので、現在、自分がいる位置がすぐにわかりますよ。
もちろん商用利用可です。
ソースはGitHubのFixed Navにありますよ。
デモをご覧になりたい方は以下からどうぞ。
DemoFixed Nav

お役に立てましたら、以下どれでも結構のですので、ポチリと……。

  • 0
  • 0
  • 6
  • 11

Amazonアソシエイト・プログラム規約による記載
当サイトはamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

この記事を読んだ人はこんな記事も読んでいます

これは魅力的!CSSだけで実装できる画像ホバーエフェクト20

これは魅力的!CSSだけで実装できる無料の画像ホバーエフェクト22

CSSだけで実装できる魅力的な画像用のホバーエフェクトをご紹介します。 種類は全部で22種類です。

記事を読む

売上手数料なし!簡単・便利なWixStoresでネットショップを開業する方法

「知識ゼロだけど自分でネットショップを作りたい」「業者に頼む余裕も予算もない」そんな方にオススメなの

記事を読む

よくわかる 初心者のためのCSS3 transitionとtransformのチュートリアル

よくわかる 初心者のためのCSS3 transitionとtransformのチュートリアル

初心者のためのCSS3 transition(トランジション)とtransform(トランスフォーム

記事を読む

CSSアニメーションを簡単・思いのままに作成できてしまう「Bounce.js」

CSSアニメーションを簡単・思いのままに作成できてしまう「Bounce.js」

最近のサイトではCSSアニメーションを使って、ユーザーに効果的な見せ方をしているサイトも増えてきまし

記事を読む

HTMLメールの無料テンプレートをお探しなら「無料で利用できるオープンソースなHTMLメールテンプレートコレクションサイト」

HTMLメールの無料テンプレートをお探しなら「Open Source Email Templates」

HTMLメールは、メールでの占める割合を着実に増やしていますよね。 美しいデザインのHTMLメール

記事を読む

CSS3を知らなくてもOK!便利すぎるCSS3関連ツール&ジェネレーター51

CSSを入力するときには、細かいプロパティを覚えていないと、作業がなかなかはかどりません。 特に、

記事を読む

スクロールした位置についてくるStickyプラグイン15

スクロールした位置についてくるStickyプラグイン15

スクロールした位置についてくる要素を実装するjQueryプラグイン「Stickyプラグイン」をまとめ

記事を読む

美しいCSSグラデーションをランダムにつくってくれる「Random CSS Gradient Generator」

美しいCSSグラデーションをランダムにつくってくれる「Random CSS Gradient Generator」

ズボラな自分に最適なCSSグラデーション作成ツールがあったので、ご紹介します。 グラデーションを自

記事を読む

HTML5ビデオにも対応できる無料動画変換ツール/コンバーター10

HTML5ビデオを利用したサイトも見かけるようになってきました。 今後はHTML5ビデオを利用する

記事を読む

WEBデザインのインスピレーションに!UIデザインのコードスニペットコレクション「CodeMyUI」

WEBデザインのインスピレーションになるUIデザインのコードスニペットがコレクションされた「Code

記事を読む