Trunk.js

JavaScript

滑らかなスライド表示がいい!レスポンシブなナビゲーションメニュー「Trunk.js」

Trunk.jsはレスポンシブに対応したナビゲーションメニューを実装することができるjQueryプラグインです。左サイドから滑らかにメニューがスライド表示されるシンプルで操作性のいいナビゲーションメニューをつくることができます。

Trunk.js

Trunk.js

PC閲覧時にはあらかじめメニューが横一列に表示されていますが、スマホやタブレットからだとこれが非表示になり、メニューアイコンが表示されます。

アイコンをクリックすると左サイドからメニューがスライドで表示されます。表示された際に軽くバウンドするあたりのアニメーションがいい感じですね。

シンプルでとても使いやすいナビゲーションメニューだと思います。

レスポンシブに対応していることから、いろんなデバイスで快適にナビゲーションメニューを操作できます。

スマホやタブレットの閲覧時に、滑らかにスライド表示するナビゲーションメニューを実装したいという方は、ぜひTrunk.jsを活用されてみてはいかがでしょうか。

mophie juice pack heliumiPhone SE対応の超薄型バッテリーケース「mophie juice pack helium for iPhone 5s/5」前のページ

陽炎のような揺れを表現できる「Animated Heat Distortion Effects with WebGL」次のページAnimated Heat Distortion Effects with WebGL

関連記事

  1. jQuery Reel Plugin

    JavaScript

    上下左右の色んな角度から画像を回転させて見せることができる「jQuery Reel Plugin」

    これは面白いですね。画像を上下左右と色んな角度から回転させながら見るこ…

  2. lightGallery
  3. no-image
  4. curtains.js

    JavaScript

    カーテンがヒラヒラ動くようなテクスチャ面を実装できる「curtains.js」

    curtains.jsはカーテンがヒラヒラと波打つ動きのようなテクスチ…

  5. jQueryを使わないコード集

    JavaScript

    jQueryを使わないでコードを書くTips集

    jQueryを使えば簡単にできることがたくさんあるんですが、ちょっとし…

最近の記事

  1. フィールグッドシャワー
  2. RP-PB055
  3. ESD-EFシリーズ

アーカイブ

PAGE TOP