nlog

とめどなく流れるよだれ

Bootstrap4移行ガイドを読む(コンポーネント編、ツールチップ)

ツールチップ - Bootstrap4移行ガイド

  • ツールチップは、オリジナルな title 属性みたいなもの。リンクにカーソルを合わせたときに説明文が書かれた吹き出しを表示する
  • ツールチップはパフォーマンス上の理由で任意で取得されるため、自分で初期化する必要がある
    • data-toggle 属性で要素を選択することで、初期化できる
  • 動作させるには Popper.js が必要
  • 動作させるには util.js も必要
  • title が入力されていないツールチップは表示されない
  • ツールチップを表示したいリンクに data-toggle="tooltip"title="ツールチップ文" を指定する
    • title 属性には HTML 要素を入れることもできる
  • data-placement 属性でポップオーバーの表示位置を指定できる
    • 上 ... data-placement="top"
    • 下 ... data-placement="bottom"
    • 左 ... data-placement="left"
    • 右 ... data-placement="right"