Slideout.js

JavaScript

軽量でタッチスライド対応のサイドメニュー・Slideout.js

Slideout.jsは軽量でスマフォでのタッチスライドに対応したサイドメニューを実装することができます。jQueryなどを用いずにJSだけで動作するのがいいですね。横からスライドするナビゲーションを取り入れたい時に覚えておきたいところです。

Slideout.js

デモ

スマフォの他に、もちろんPCでもサイドからのスライドメニューを実装することができます。

横にスライドするアニメーション動作もシンプルで違和感がないのがいいですね。自然な感じで操作もとてもしやすいと思います。

モバイルからのアクセスがかなり増えてきているので、これからサイトを制作する時にはこういった機能を活用してモバイルファーストで設計してきたいですね。

というわけで、タッチに対応した横からスライドするメニュー「Slideout.js」のご紹介でした。

Slideout.js

関連記事

  1. Squishy

    JavaScript

    テキストをコンテナに合わせて自動でサイズ変更してくれるjQueryプラグイン「Squishy」

    SquishyというjQueryプラグインを使えばテキストをコンテナに…

  2. no-image

    JavaScript

    ミニマルでダイナミックなLightboxプラグイン「darkbox.js」

    darkbox.jsはミニマルながらもダイナミックなLightbox風…

  3. Listt

    JavaScript

    リストをiOSのようにアニメーションできるjQueryプラグイン「Listt」

    ListtはリストをiOSのセレクトボックスのようにアニメーションさせ…

  4. Pilpil

    JavaScript

    プログレッシブ形式で画像表示時間を短縮してくれる「Pilpil」

    Pilpilは、ページの画像表示の時間を短縮するためのJSライブラリで…

  5. imgViewer2

    JavaScript

    画像のズームとパン機能を備えたjQueryプラグイン「imgViewer2」

    imgViewer2は画像のズームとパン機能を備えたjQueryプラグ…

  6. overhang.jp

    JavaScript

    シンプルでクールな通知バーを実装できるjQueryプラグイン「overhang.jp」

    overhang.jsは、通知バーを実装するためのjQueryプラグイ…

最近の記事

  1. Olli
  2. 単語帳メーカー(Flashcard Maker App)
  3. 1Password 7
  4. 風に揺れる草

Facebookページ

PAGE TOP