背景の不透明度

Question

不透明度の影響を受けない要素の背景を維持する方法はありますか？

I.E.私はjqueryアコーディオンを持っていますが、特定の要素のコンテンツをクリック/ホバリングしたときに、不透明度が変化し、その下の他の要素を見ることができます。

私はそれを変えることができるのだろうかと疑問に思ったので、各リスト要素には白い背景がありましたは消えません？

いくつかのコード：

<div id="accord_container"><div id="accord"> 
<ul> 
    <li><a id="a1"><img src="img/accord/1.jpg" /></a></li> 
    <li><a id="a2"><img src="img/accord/3.jpg" /></a></li> 
    <li><a id="a3"><img src="img/accord/7.jpg" /></a></li> 
    <li><a id="a4"><img src="img/accord/8.jpg" /></a></li> 
</ul> 
</div></div> 

#accord_container{width:930px; margin:0px auto;} 
#accord{height:480px; overflow:hidden; margin:5px; position:relative; cursor:pointer;} 
#accord ul{position:relative; list-style:none; margin:0; padding:0;} 
#accord ul li{float:left; display:block; margin-right:0px; background-color:#FFF;} 
#accord ul li a{display:block; overflow:hidden; height:480px; width:72px; opacity:0.75; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; filter:alpha(opacity=75);} 
#accord ul li img{position:absolute;} 
#a1{width:700px; opacity:1.0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100);} 

$(document).ready(function(){ 
    lastBlock = $("#a1"); 
    maxWidth = 700; 
    minWidth = 72; 

    $("#accord ul li a").click(
     function(){ 
    if(lastBlock.id == this.id || (lastBlock.id == undefined && this.id == "a1")){ 
    if(this.rel){ 
     window.location=this.rel; 
     } 
    }else{ 
     $(lastBlock).animate({width: minWidth+"px", opacity: 0.75}, { queue:false, duration:400}); 
    $(this).animate({width: maxWidth+"px", opacity: 1.0}, { queue:false, duration:400}); 
    lastBlock = this; 
    } 
    } 
); 
$("#a1").animate({width: maxWidth+"px", opacity: 1.0}, { queue:false, duration:400}); 

}）。

Answer 1

コンテンツをラップするだけです。ですから、（単なる例）以下の構造を持っている場合：

<div class="hasBackground"> 
    <div class="theContent"> 

    </div> 
</div> 

あなたがバックグラウンドを持っている外側のdivに影響を与えずに、内側のdivの不透明度を設定することができます。