Sliiide

JavaScript

シンプルなスライディングメニューを実装できる「Sliiide」

Sliiideはシンプルなスライディングメニューを実装することができるjQueryプラグインです。上下左右と好きな位置からメニューをスライド表示させることができるので、自分のサイトにも合わせやすそうですね。

Sliiide

デモ

Left、Top、Right、Bottomのアイコンからスライドさせる位置を選択することができます。

例えば、Topを選択して左上にあるメニューアイコンをクリックすると、上からスライドしてきます。ちょっとした遊び心があって操作していて楽しいですね。

一般的なナビメニューじゃつまらないっていう方は、ぜひ一度チェックしてみてはいかがでしょうか。

こんな感じでオプションもいろいろと揃っています。placeでスライドさせる位置を指定することができます。

var settings = {
    toggle: "#sliiider-toggle",
    exit_selector: ".slider-exit",
    animation_duration: "0.5s",
    place: "left",
    animation_curve: "cubic-bezier(0.54, 0.01, 0.57, 1.03)",
    body_slide: true,
    no_scroll: true
};

$('#menu').sliiide(settings);

Sliiide

jQuery PieTimer時間の経過とともに円形が欠けていくタイマー「jQuery PieTimer」前のページ

数値をインジケーターで見やすく表示できる「Bar Indicator」次のページBar Indicator

関連記事

  1. Simple Sidebar
  2. JavaScript

    画像やHTML要素に簡単にドロップシャドウをつけられるjQueryプラグイン「pShadow」

    個人的にすごく便利で使う機会がありそなjQueryプラグインの紹介です…

  3. no-image

    JavaScript

    グリッドレイアウトによるシンプルで軽量なギャラリー「Grid Gallery」

    Grid Galleryはグリッドレイアウトによるシンプルで軽量なイメ…

  4. jQueryでウィンドウサイズによって処理を変える

    JavaScript

    jQuery(JavaScript)で指定した要素の子要素数や最大文字数を配列内から取得する

    jQueryで指定した要素の子要素の数やその文字数、文字なんかを配列に…

  5. jQuery Section Navi Plugin
  6. Basic Metro Dynamic jQuery Tab Menu

最近の記事

  1. OWL-LPB6701LA
  2. cheero Power Mountain mini 30000mAh CHE-110
  3. 帆布カメラインナーケース B-2タイプ

アーカイブ

PAGE TOP