Comment modifier l'opacité d'arrière-plan correctement

Question

J'ai donc un div qui comprend un formulaire avec de nombreux champs de saisie.

Si je clique sur un bouton, tous les champs de saisie sont désactivés et l'opacité de ces champs de saisie devrait se situer autour de 0,2.

également une image pops un peu haut, (il style.display a été mis à none, et maintenant onclick-block) Ainsi, alors que l'opacité des éléments se parfaitement inhibés et rendues transparentes, l'onclick de l'image qui apparaît doesn » t fonctionne, s'il y a un champ de saisie en arrière-plan.

Existe-t-il un moyen de ne pas compliquer la disparition des champs de saisie tout en étant capable d'appuyer sur l'image à chaque pixel?

<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

pour changer l'opacité sur un clic, vous pouvez utiliser jquery comme indiqué:

$(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>