クリッカブルマップとロールオーバーを同時に使う外部CSSの書き方

似た質問はあったのですが、解決できなかったので質問させていただきました。

ホームページでクリッカブルマップにしている画像(A.gifとします)があるのですが、
リンクにマウスを乗せたとき、それぞれのリンク別々の画像を表示させたいのです。(ホームページはテキストエディットで作っています)

　　　A.gifの中にリンク１、リンク２、リンク３があるとします。
　　　●リンク１にマウスが乗ったとき→A.gifがB.gifに変わる
　　　●リンク２にマウスが乗ったとき→A.gifがC.gifに変わる
　　　●リンク２にマウスが乗ったとき→A.gifがD.gifに変わる

というふうにしたいのですが・・・。

自分で本やネットで探してみたところ、javasprictを使ったやり方はなんとかわかりました。
けれどjavasprictは見る人の環境によって表示されなかったりするし、ソースをシンプルにしたいので、外部CSSでのやり方を探しています。。。

ただのロールオーバーだけなら外部CSSで作ることはできましたが、クリッカブルマップと併用しようとするとわからなくなってしまいました。

独学で作ってきたので説明文など、至らない点があるかもしれないのですが、できるだけ詳しく教えていただければありがたいです。
もし不明な点があれば補足致します。
よろしくお願いします。

No.2 回答者： noname#66720 回答日時： 2008/05/06 08:52

試したことはないのですが、おそらくIE6以下は対応できません。

javascript等を使えばhoverに対応させることもできますが、本末転倒・・・

現状でjavascriptをオフにしている人はそんなにいないはずなので、個人的にはjavascriptでいいと思います。
もしもソースを綺麗にしたいのであれば、外部ファイルにして読み込むという方法もありますよ。

No.1 ベストアンサー 回答者： goldfox 回答日時： 2008/05/04 14:06

＞ただのロールオーバーだけなら外部CSSで作ることはできましたが、

そのソース（html、css）とクリッカブルマップのソース、
両方提示しましょう。