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
  2. JavaScript

    テキストの一部分をサラっとアニメーションさせるjQueryプラグイン「dynamo.js」

    テキストで指定した一部分をサラっとアニメーションさせるjQueryプラ…

  3. Tippy.js

    JavaScript

    軽量ながらも多彩なツールチップを実装できるJSライブラリ「Tippy.js」

    Tippy.jsは軽量でありながらも多彩なツールチップを実装することが…

  4. Nex

    JavaScript

    ダイナミックで美しいフルスクリーンのjQueryスライダーを実装できる「Nex」

    Nexはダイナミックで様々なアニメーションエフェクトが用意されたフルス…

  5. jQuery Context Menu

    JavaScript

    軽量でシンプルなコンテキストメニューを実装できる「jQuery Context Menu」

    jQuery Context Menuは、軽量でシンプルなコンテキスト…

  6. jQuery.GI.TheWall.js

コメント

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

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

最近の記事

  1. 久保田城
  2. ハードサイド CS80
  3. ACC-TRBX
  4. ピスタチオ クリスマス ツリー フラペチーノ

Instagram始めました

Facebookページ

PAGE TOP