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サイトなんかによく使われていますよね。コンテンツを格好良く見せたい、または集中させたい時なんかに使ってみるとよさそうです。

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

関連記事

  1. no-image

    JavaScript

    シンプル・軽量なアナログ時計を実装できる「jsRapClock」

    jsRapClockはシンプルで軽量なアナログ時計を実装できるjQue…

  2. Typewriter JS

    JavaScript

    タイプライターっぽいエフェクトでテキストを表現できる「Typewriter JS」

    Typewriter JSは、タイプライターを使って文字入力するような…

  3. JavaScript

    ニュースやお知らせなどに使えるティッカー「jQuery WebTicker」

    ニュースやお知らせなんかに使えるティッカー「jQuery WebTic…

  4. Horizon Swiper

    JavaScript

    スワイプやスクロール対応の軽量なjQueryプラグイン「Horizon Swiper」

    Horizon Swiperはスワイプやブラウザスクロールに対応したj…

  5. 2013年上半期jQueryプラグインまとめ

    JavaScript

    当ブログで紹介したjQueryプラグイン19選のまとめ 2012/04 – 2012/0…

    2012年4月〜2012月7月までの当ブログで紹介したjQueryプラ…

  6. hop

    JavaScript

    Webページ上の好きな場所をハイライトできる「hop」

    hopはオーバーレイされたWebページ上の好きな場所をハイライトするこ…

コメント

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

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

最近の記事

  1. M360bt
  2. BQ-CASE/1
  3. GLOO BOX

アーカイブ

PAGE TOP