JavaScript

色んなメニューやコンテンツをモーダルウィンドウで実装できるjQueryプラグイン「Pop Easy」

お洒落で可愛らしいjQueryプラグインを見つけたのでご紹介します。ログインフォームや動画、地図などといった色んなメニューやコンテンツをモーダルウィンドウで実装することができる「Pop Easy」です。オプションで色んな設定変更が可能なので自分好みにカスタマイズもしやすいですね。

[ads_center]

使い方

実際のデモではこのようにログインフォームや動画など実用性あるコンテンツをモーダルウィンドウで実装されています。

Pop Easy

なかなかお洒落でよさそうですね。

使い方もシンプルで特に難しい設定はなさそうな感じです。オプションでエフェクト、スピード、背景色、透明度など色んな項目が設定できます。

$(document).ready(function(){
    $('.modalLink').modal({
        trigger: '.modalLink',
        olay:'div.overlay',
        modals:'div.modal',
        animationEffect: 'slidedown',
        animationSpeed: 400,
        moveModalSpeed: 'slow',
        background: '00c2ff',
        opacity: 0.8,
        openOnLoad: false,
        docClose: true,
        closeByEscape: true,
        moveOnScroll: true,
        resizeWindow: true,
        video:'URLを指定',
        close:'.closeBtn'
    });
});

モーダルウィンドウはお洒落なWebサイトなんかによく使われていますよね。コンテンツを格好良く見せたい、または集中させたい時なんかに使ってみるとよさそうです。

ダウンロードや詳しい使い方に関しては以下の公式サイトで確認できます。

エアーハンガー空気で膨らむ持ち運びに優れたエアーハンガー前のページ

乾電池からiPhoneなどを充電することができるBIRDの「DC-Pod MHC-05B-1.2」次のページ

関連記事

  1. no-image

    JavaScript

    シンプルでパワフルなセレクトボックスを実装できる「SelectPage」

    SelectPageはシンプルながらも高いカスタマイズ性を備えたパワフ…

  2. no-image

    JavaScript

    プレーンなJavaScriptによるレスポンシブなLightbox「jsOnlyLightbox」

    jsOnlyLightboxは、jQueryなどを必要としないプレーン…

  3. Recursive Hover Nav
  4. Accessible Mega Menu
  5. jQuery Sidebar

    JavaScript

    上下左右からクイックなスライド表示させることができるjQuery Sidebar

    jQuery Sidebarは上下左右からスライド表示させることができ…

  6. PopSelect

    JavaScript

    タグ形式のセレクトボックスをポップオーバーで表示させる「PopSelect」

    PopSelectはタグ付けするような感覚のセレクトボックスをポップオ…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. パニーニ(フォカッチャ ベーコンときのこのゴルゴンゾーラクリーム)とエスプレッソ
  2. 広尾 スタバ
  3. 芳醇な香りのラムレーズンサンド
  4. Aモーニングセット
  5. 白トリュフの塩パンやメロンパンなど

アーカイブ

PAGE TOP