Slideout.js

JavaScript

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

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

Slideout.js

デモ

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

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

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

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

Slideout.js

Google検索で日付や期間指定をして検索結果を表示する方法前のページ

スライド機能がついたプロダクトギャラリーを実装できる「Product Preview Slider」次のページ

関連記事

  1. no-image

    JavaScript

    シンプル・軽量なjQueryイメージビューア「WimmViewer」

    WimmViewerはシンプルで軽量なイメージビューアを実装できるjQ…

  2. Points Of Interest

    JavaScript

    各ポイントごとにクリックで詳細文を表示させるjQuery「Points Of Interest」

    Points Of Interestはサイト内に設置した各ポイントを…

  3. vallenato.js

    JavaScript

    シンプルで実装も簡単なjQueryアコーディオン「vallenato.js」

    vallenato.jsは、シンプルで簡単に実装することができるjQu…

  4. JavaScript

    シンプルでスタイリッシュなLightbox風のjQueryプラグイン「Featherlight」

    シンプルでスタイリッシュなデザインが特徴的なLightbox風のjQu…

  5. Stackbox.js

    JavaScript

    プルプル震えるモーダルボックスを実装できるjQueryプラグイン「Stackbox.js」

    Stackbox.jsというjQueryプラグインを使えば、プルプル震…

  6. Simple Lightbox

最近の記事

  1. ユニクロ エアリズム マイクロメッシュVネックT(半袖)
  2. ライオン システマ 超コンパクト ふつう
  3. タリーズ ハムチーズ&サラダサンド
  4. クリニカのY字タイプのフロス
  5. 日和山公園の桜

アーカイブ

PAGE TOP