背景画像を使用せずに、ホバー/ロールオーバー時に純粋な CSS 画像を変更しようとしています。これまでのところ、1 つの画像があり、その画像をロールオーバーすると、別の画像が表示されます。CSSは次のとおりです。
#hidden {
display: none;
}
#visible:hover + #hidden {
display: block;
}
したがって、#visible
div をロールオーバーすると、#hidden
div が表示されます。これが jsFiddle です: http://jsfiddle.net/MNyzd/1/
これはうまく機能しますが、まさに私が達成したいことではありません。画像を差し替えたい。したがって、ロールオーバーすると、表示されたままになるのではなく、消える#visible
はずです。私の最初の最初のアイデアは、div をホバー ( ) にすることでしたが、これはうまくいきませんでした。#visible
display:none
#visible:hover display:none;
この方法を使用して、これを従来の画像のホバー/スワップに成功させる方法を知っている人はいますか? 任意の助けをいただければ幸いです。ここに jsFiddle があります... http://jsfiddle.net/MNyzd/1/