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. Responsive jQuery Pop Up Gallery
  2. Glide.js
  3. Solution for Long Drop Down Items

    JavaScript

    長いメニューもスクロールで表示できる「Solution for Long Drop Down Ite…

    長いドロップダウンメニューでもスクロール表示してくれるjQueryを活…

  4. Responsive Sidebar Navigation
  5. Menu Droplet Animation
  6. gridstack.js

    JavaScript

    ウィジェットレイアウトを作成できるjQueryプラグイン「gridstack.js」

    gridstack.jsはドラッグ&ドロップでウィジェットレイアウトを…

最近の記事

  1. スタバ ドリップコーヒー
  2. エチオピア
  3. 紗々 飴色和栗
  4. DCG-CA21
  5. Apple WatchでのMacロック解除を無効

アーカイブ

PAGE TOP