2

ツイッターやフェイスブックなどへのリンクとして3つの小さな画像を使用しているサイトで作業しています。画像の上にマウスを置いたときに表示したいコールアウト画像があります。

ここで重要なのは、コールアウト画像がページ上の他の画像やテキストと干渉しないことです。

このニーズを満たす便利なソリューションはありますか？

4

3 に答える 3

3

肯定的ではありませんが、背景画像を割り当て、背景位置プロパティを使用して、ホバーおよび非ホバー状態で適切な画像を表示できるように思えます

a.twitter { display: block; width: 16px; height: 16px;
            background: url(/images/twitter-hover.png) no-repeat 0 0; }
a.twitter:hover { background-position: 0 16px }

これは、垂直に積み重ねられた 2 つの 16x16 ボタン (非ホバーとホバー) で構成される 16x32 スプライトを想定しています。

これは基本的な例ですhttp://www.dynamicsitesolutions.com/css/background-image-switching/

于 2009-09-01T21:29:07.380 に答える
1

MooToolsを試しましたか？彼らはあなたの要件を満たすかもしれない多くのJavascriptユーティリティを持っています。

于 2009-09-01T21:09:52.707 に答える
1

古い学校:

画像を 1 つに結合し、適切な div を表示する onmouseover イベントでクライアント側のイメージマップを使用します。

新しい学校:

CSS ホバー疑似クラスを使用します。ここに良い例があります: http://www.dynamicdrive.com/style/csslibrary/item/css-popup-image-viewer/ (すべてのブラウザで動作するとは限りません)

于 2009-09-01T21:19:14.340 に答える