1

誰かがこれで私を助けてくれることを願っています。

私はこのHTMLを手に入れました:

<a href="http://test"><div id="topleftbox"></div></a>
<a href="http://test"><div id="toprightbox"></div></a>
<a href="http://test"><div id="bottomleftbox"></div></a>
<a href="http://test"><div id="bottomrightbox"></div></a>

これらの div を次のような背景画像でスタイルします。

#topleftbox {
  background: url(../img/images/layout_03.jpg);
  background-repeat: no-repeat;
  width: 229px;
  height: 228px;
  float: left;
  }

 #topleftbox:hover {
  background: url(../img/hoverimages/layout_03.jpg);
  }

新しい画像でのホバーは機能します。:visited と :active を追加して、前のリンク/画像をクリック/訪問した後に新しい (ホバー) 画像が永続的に表示されるようにすることはできますか?

ありがとう


jsfiddle.net/AcvbG - これは色で機能するようになりました。奇妙なことに、背景画像ではありません..

私の目標はWhen clicking,hovering the #leftbox、:visited、:hover、:active を使用して、背景画像を別の画像に変更することです。

誰でも解決策を知っていますか?または、JavaScriptを使用する必要がありますか(知識が限られています)ありがとうございます

4

1 に答える 1

1

それらの疑似クラスがあなたが望むことをするとは思いません。
http://www.w3.org/TR/CSS2/selector.html#dynamic-pseudo-classes

:active 疑似クラスは、要素がユーザーによってアクティブ化されている間に適用されます。たとえば、ユーザーがマウス ボタンを押して離すまでの時間です。

:visited 疑似クラスは、ユーザーがリンクにアクセスすると適用されます。

JavaScript を使用する場合は、いくつかのオプションがあります。

編集:

タグのスタイルを<a>div のようにして、背景を変更するだけでよい可能性があります。それは完全に実行可能です。

http://jsfiddle.net/AcvbG/

于 2013-02-27T22:20:19.867 に答える