スクロールで隠れるナビゲーションメニューのJSがステキだったので勝手にプラグイン化しました

2014年01月15日

こちらのブログで公開されていたものがステキでした。

スクロールで隠れるナビゲーションメニューhidenavi.jsをjQueryで作りました | Kana-Lier カナリエ

こういった隠す系の動きをやりたい事って結構多いですよね。

なのでいつもな感じでjQUeryにしてみました。勝手にやっちゃってすみません。

デモ

※ 画像とか勝手にこちらのサーバに置かせてもらってます。後日ちゃんと自分のものに変えますね、すみませんすみません。
※ ごめんなさいあとで自分の作ったページで公開しますね。とりあえず今デモは削除してます。

ファイルはこちら

スクリプトファイル

使い方

これで動きますよー

<script type="text/javascript" src="jquery.js" ></script>
<script type="text/javascript" src="jquery.hidenavi.js"></script>
<script>
$(function(){
  $("#nav").hidenavi();
});
</script>

オプション

今のところ元スクリプトにあった変更箇所は変えられるようにしてます。

  • scrollPosition : どれくらいスクロールしたら隠すか
  • navTopPosition : どの高さに置いておくか
  • navHover : 隠した際のナビゲーション要素

こういったインターフェイスは色々とストックしておけると色々助かりますよね。

KanaLierさんありがとうございます

他にこんな事も書いてます

FBでコメント

この記事はコメント、トラックバックおよびピンバックを受け付けていません。