0

次のコードは、divタグの画像を示しています。

<div class='item'>
        <img class='img' src="image1.png" alt="" />
</div>

次のcssを使用して、html画像コードに効果を追加しています。

img{
width:50px;
height:50px;
opacity:0.4;
filter:alpha(opacity=40);

}

img:hover{
opacity:1.0;
filter:alpha(opacity=100);
}

これを使用して、cssで不透明度の効果を出します。このコードを使用すると、画像自体にカーソルを合わせると不透明効果がうまく機能します。しかし、代わりにdivタグにカーソルを合わせると、画像の不透明度の影響が発生するようにするにはどうすればよいですか。画像をカプセル化したアイテムdivの任意の部分にカーソルを合わせて、画像の不透明度の変更効果を取得できるようにしたいと思います。div全体ではなく画像のみに対するNB効果。これはcssで実行できますか?もしそうなら、どのように?

4

2 に答える 2

5

これを変える:

img:hover{
opacity:1.0;
filter:alpha(opacity=100);
}

.item:hover img{
opacity:1.0;
filter:alpha(opacity=100);
}

imgこれにより、divが状態のときの不透明度が変更されhoverます。

于 2012-10-08T03:06:34.450 に答える
0

これにjqueryを使用する場合、これは簡単だと思います

 $('.item').hover(function(){ $('.img').css('opacity','1.0');}, function(){ $('.img').css('opacity','0.4');});

私はあなたがjqueryを知っていると思います。Sitepointによると、href属性を持たない要素に対してCSSの:hover疑似クラスを使用することはできません。

于 2012-10-08T03:18:09.233 に答える