Popper.js

JavaScript

軽量で見やすいツールチップを実装できる「Popper.js」

Popper.jsはユーザーにとって見やすいツールチップを実装できるJSライブラリです。容量が軽量なところもGoodですね。ツールチップを表示する位置を指定できたり、ドラッグした際にツールチップも追従させることができたりとカスタマイズして使いたい方にもピッタリのツールチップです。

Popper.js

Popper.js

ツールチップを表示する位置はplacementにtop、right、bottom、leftのいずれかを指定すればOKです。上下左右の好きな位置に表示させることができます。

ほかにもコンテナがスクロールで見えなくなりそうなときでもツールチップだけを見える位置にとどまらせたり、コンテナをドラッグしたときにツールチップも一緒に追従させたり、またはスクロール時にツールチップを見やすいように上下フリップさせたりといったことが可能です。

どの設定も閲覧するユーザーにとってはありがたい機能になるのではないでしょうか。

そんなわけで、軽量で見やすいツールチップを実装したい方は、ぜひPopper.jsをチェックしてみてください。

スタイルリングスマホ用落下防止リング、車載ホルダー、スタンドと1つで3役の「スタイルリング」前のページ

時刻を指定しやすくしてくれるjQueryのタイムピッカー「timedropper」次のページtimedropper

関連記事

  1. no-image

    JavaScript

    スタイリッシュなスライダーを実装できるjQueryプラグイン「bsc-slider」

    bsc-sliderは、シンプルでスタイリッシュなスライダーを実装する…

  2. no-image

    JavaScript

    シンプル・軽量なjQueryイメージビューア「WimmViewer」

    WimmViewerはシンプルで軽量なイメージビューアを実装できるjQ…

  3. Before and after slider
  4. no-image

    JavaScript

    いろんなズーム機能を実装できるjQueryプラグイン「xZoom」

    xZoomはいろんなズーム機能を実装することができるカスタマイズ性に優…

  5. JavaScript

    複数カラムをレスポンシブに対応させるjQueryプラグイン「jquery.columns」

    複数あるカラムをレスポンシブに対応させるためのjQueryプラグイン「…

  6. SuperEmbed.js

    JavaScript

    さまざまな埋め込み動画をレスポンシブで表示できる「SuperEmbed.js」

    SuperEmbed.jsは、さまざまな埋め込み型の動画をレスポンシブ…

最近の記事

  1. 芳醇な香りのラムレーズンサンド
  2. Aモーニングセット
  3. 白トリュフの塩パンやメロンパンなど
  4. 東京都現代美術館
  5. スーリア バターチキン

アーカイブ

PAGE TOP