以下のコードでは、ユーザーがスパンにカーソルを置いたときにツールチップを表示させたいのですが、どのようにすればよいでしょうか? リンクは使用したくありません。
<span> text </span>
ここでは、シンプルでビルトインの方法を紹介します。
<span title="My tip">text</span>
これでプレーンテキストのツールチップが得られます。 フォーマットされたHTMLを含むリッチなツールチップが欲しい場合は、そのためのライブラリを使う必要があります。 幸いなことに、これらのライブラリは大量にあります]1。
ほとんどのブラウザでは、title属性はツールチップとして表示され、どのような種類の要素にも柔軟に対応することができます'。
<span title="This will show as a tooltip">Mouse over for a tooltip!</span>
<a href="http://www.stackoverflow.com" title="Link to stackoverflow.com">stackoverflow.com</a>
<img src="something.png" alt="Something" title="Something">
これらはすべて、ほとんどのブラウザでツールチップを表示します。