jsPanel3

JavaScript

多機能なフローティングパネルを実装できるjQueryプラグイン「jsPanel3」

jsPanel3は、高度で多機能なフローティングパネル(ウィンドウ)を実装することができるjQueryプラグインです。フルスクリーン、リサイズ、ドラッグ移動など、いろんな機能が搭載されています。

モーダルウィンドウ、通知、ツールバーなども実装できる

デモ

デモでは画面の下の方にフローティングパネルが表示されています。パネルの右上に表示されているいくつかのアイコンから、パネルを閉じたりフルスクリーンにしたり、またはリサイズしたりといったことが可能です。

また、パネルの上部にカーソルを合わせるとカーソルのアイコンが変化するので、その状態でドラッグするとパネルを好きな位置に移動することができます。ブラウザ上でこれだけ自由なフローティングパネルが実装できるのはうれしいですね。

パネルの中に表示されている「Next panel」をクリックすると、次のパネルが表示されます。

いろんなパネルのデザインがあったり、パネル内にツールチップを実装したり、はたまた動画を表示したりと、カスタマイズ次第でいろんなタイプのフローティングパネルを設置できます。

ほかにも、モーダルウィンドウ、通知、ツールバーなどの実装も可能です。

オプションもかなり豊富で、autoclose、border、callback、closeOnEscape、config、container、content、contentAjax、contentIframe、contentOverflow、contentSize、dblclicks、delayClose、dragit、draggable、footerToolbar、headerControlsなどなど、これ以外にもたくさんの数のオプションやAPIが用意されています。

多機能でカスタマイズ性にも優れたフローティングパネルを実装できるjQueryプラグインを探している人は、ぜひ「jsPanel3」をチェックしてみてください。

jsPanel3

関連記事

  1. JavaScript

    水面にゆらゆらと波打つ動きを与えてくれるjQueryプラグイン「lake.js」

    面白そうなプラグインだったので使ってみました。画像を指定するとその画像…

  2. Trunk.js

    JavaScript

    滑らかなスライド表示がいい!レスポンシブなナビゲーションメニュー「Trunk.js」

    Trunk.jsはレスポンシブに対応したナビゲーションメニューを実装す…

  3. JavaScript

    スクロール時にナビゲーションが上部に固定されるレスポンシブ対応のjQueryプラグイン「HeadSh…

    スクロールするとナビゲーションが上部に固定配置されるjQueryプラグ…

  4. no-image

    JavaScript

    手軽にパララックス効果を実装できるシンプル・軽量な「simpleParallax」

    simpleParallaxは、手軽にパララックス効果を画像に実装する…

  5. jquery.matchHeight.js
  6. Sticker.js

    JavaScript

    ペラッとめくるようなエフェクトが素敵なJSライブラリ「Sticker.js」

    画像や要素をペラッとめくるようなエフェクトを実装できるJSライブラリ「…

最近の記事

  1. オリジナルチキン6ピース
  2. 200-DGCAM019
  3. ハクバ GW-PRO RED フォトグローブプロ PL
  4. Soundcore Liberty Air 2

アーカイブ

PAGE TOP