背景の不透明度を正しく変更する方法

Question

私は多くの入力フィールドを持つフォームを含むdivを持っています。

ボタンをクリックすると、すべての入力フィールドが無効になり、これらの入力フィールドの不透明度が約0.2に変更されます。

また、画像はちょっと「doesnのをポップアップした画像から、（それはstyle.displayがnoneに設定され、そして今blockからonclickた）だから要素の不透明度は完全に無効になりながら透明化され、onclickをポップアップ表示バックグラウンドに入力フィールドがある場合は、作業しません。

共起しないように入力フィールドを消しても、すべてのピクセルで画像を押すことができる方法はありますか？

<div><img id="i" style="display:none" onclick=dothis(event) src="dsds.png" /></div> 
<div id="d"><input id="c" onclick="dis()" type=button value="hey"><input id="f" type=text ></div> 

<script> 

function dis(){ 
document.getElementById("i").style.display="block"; 
document.getElementById("d").style.opacity="0.2"; 
document.getElementById("c").disable=true; 
document.getElementById("f").disable=true; 
} 

Answer 1

クリックで不透明度を変更するに示すように、あなたはjqueryのを使用することができます。

$(document).ready(function() { 
 
    $("#button").click(function(){ 
 
    $("#content_to_fade").css('opacity', '0.2'); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> 
 
<div> 
 
\t <p id="content_to_fade">Test</p> 
 
\t <button id="button">Button</button> 
 
</div>