• RSS

[JS]jQuery fatNavの拡大縮小アニメーションを停止する方法

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

[JS]jQuery fatNavの拡大縮小アニメーションを停止する方法

以前にシンプルなフルスクリーンメニューのjQueryプラグインjQuery fatNavの記事で紹介させていただいたjQuery fatNavで、ドロワーメニューの拡大縮小アニメーションをやめる方法のご紹介です。

制作案件でjQuery fatNavを使用した際に、別のjQueryプラグインとの兼ね合いでどうしてもメニューの拡大縮小のエフェクトを外さないといけなかったという事情があり…

だったらjQuery fatNavを使うなという話ですがww、案件の都合で仕方なかったのでカスタマイズしました。

jQuery fatNavの拡大縮小アニメーションを停止する


javascriptファイルの方を触ればいいのかと思っていましたが、cssファイル(jquery.fatNav.css)の方でアニメーションが指定されていました。

jquery.fatNav.cssの66行目にある.fat-nav要素のスタイルで、-moz-transform: scale(1.4);からtransition-duration: 0.4s;までの記述をコメントアウトします。

以下のページで、拡大縮小アニメーションのないjQuery fatNavによるデモページを用意しました。
jQuery fatNavデモ(拡大縮小なし)

なお、通常の拡大縮小アニメーションのあるデモは↓こっちになります。
jQuery fatNavのフルスクリーンメニューデモ



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

コメント

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください