title: JavaScript Canvas - change the opacity of image
body: <p>I'm trying to create a platform game in Canvas. I have main character and some enemies. When player touch enemy, he will lose some HP and he will be untouchable for about 3s. Now I have one problem. After loosing HP, I want to set opacity of character image to 0.5 (to show that untouchable thing).  </p>
  
  <pre><code>var mainchar = new Image();
      mainchar.src = 'mainch.png';
  </code></pre>
  
  <p>I don't want to use <code>ctx.globalCompositeOperation = "lighter"</code> or <code>ctx.globalAlpha = 0.5</code> becouse both of them change the opacity of all elements (it's global). Is there any way to change the image opacity? For example 'mainchar.changeopacity' ?</p>