アクティブ状態私はデザインはかなり複雑であるボタン（実際には、単にリンク）を、作成しています、と私はIE8のために最適化していて、CSS3で作ることができない要素

Question

をクリックします。私はそのため<a>内<span>を配置し、両方に背景画像を入れています。

:hoverと:active上の画像の変更。すべてのブラウザでうまく動作しますが、IEではあまり効果がありません。 :hoverが正常に動作しますが、<span>をクリックすると、親<a>の:active状態がトリガされません。それは意味をなさないが、私はそれが以前に動作することを見てきたので、いくつかの回避策が必要であると思いますか？

はここでフィドルです：http://jsfiddle.net/TheNix/EtjL3/

Answer 1

あなたはjqueryまたはjavascriptを使用して、アクティブ状態のためcss classを設定することができます。

編集

あなたは...

$(document).ready(function() { 
    $("a span").click(function() { 
     $(this).addClass("active"); 
     $(this).parent().addClass("active"); 
    });  
}); 

およびCSSスタイルを、このようなCSSクラスを設定することができます...

a.active { background:green; } 
a.active span { background:lime; } ​ 

Answer 2

あなたはに次のjQueryを使用して試すことができますクリックしてCSSをインラインで追加します。

   $("a, span").click(function(){ 
        $(this).css("background", "green") 
        $(this).find("span").css("background", "lime")  
       }); 

それはhttp://jsfiddle.net/ollie/r5NDw/1/

代わりに[トリガーないインナーで：IE 8でのアクティブ状態を]のaddClass();