5

重複の可能性:
純粋な CSS を使用して「ツールチップ テール」を作成するにはどうすればよいですか?

Facebook/Twitter スタイルのツールチップを作成したいと思います (人々のプロフィールにカーソルを合わせると、プロフィールの短い要約が表示されます)。多くのチュートリアルに出くわしましたが、それらは jQuery を使用しています。これを行う方法はCSSであり、おそらくjavascriptですか?

+これが画像でも機能することを望みます。

ありがとう

4

1 に答える 1

9

あなたは純粋なCSSでそれを行うことができます

ホバー疑似クラスを使用してトリガーできます。

これがあなたが始めるべき一般的な概念です

div.profile-on-hover { display: none }
a:hover + .profile-on-hover { display: block }

<a>hover me</a>
<div class="profile-on-hover">bunch of stuff</div>

http://jsfiddle.net/AsKpv/

divは、CSSで機能するために「+」のタグに従う必要があります

おしゃれにしたい場合は、不透明度:0と不透明度:1をcss3トランジションとともに使用して、フェードインさせることもできます。

幸運を

于 2012-11-22T19:28:01.587 に答える