no-image

JavaScript

フルスクリーンによるjQueryモーダルウィンドウ実装「FullMod」

FullModはフルスクリーンによるモーダルウィンドウを実装できるjQueryプラグインです。アニメーション付きのモーダルウィンドウで、しかもフルスクリーンというダイナミックさがいい感じですね。

FullMod

デモ

デモでは「Click me」というボタンが設置されていて、ここをクリックすると下から上へスライドしながらモーダルウィンドウが立ち上がります。一方、モーダルウィンドウを閉じる場合は、モーダルウィンドウ内の右上にあるバツ印をクリックすればOKです。閉じられる時は、今度は上から下へスライドしながらモーダルウィンドウが非表示になります。

アニメーションはクイックに動作するので、煩わさもなく操作性も良好です。

使い方もシンプルで分かりやすく、イベントやメソッドもいくつか用意されています。主な項目は、onShowing(params)、onShown、onHidding(params)、onHidden、show(params)、hide(params)です。

というわけで、アニメーション付きのフルスクリーンによるモーダルウィンドウを実装できるjQueryプラグイン「FullMod」の紹介でした。

FullMod

ScrollBoosterドラッグしながらスクロールするライブラリ「ScrollBooster」前のページ

絵文字を使ったレーティング機能を実装できる「emotion-ratings」次のページemotion-ratings

最近の記事

  1. 果実そのまま みかん
  2. マリーゴールドのゴム手袋(バスルーム)
  3. クリスマスエスプレッソロースト
  4. シーザーチキン 石窯カンパーニュ
  5. スキャルプ&ヘア リファイニング トリートメント オイル R
PAGE TOP