Canvas globalAlpha property
Definition and Usage
globalAlpha property sets or returns the current transparency value (alpha or transparency) of the drawing.
globalAlpha The attribute value must be between 0.0(completely transparent) and 1.0between (opaque) and
Example
First, draw a red rectangle, then set the transparency (globalAlpha) to 0.2, and then draw a green and a blue rectangle:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="red";
ctx.fillRect(20,20,75,50);
// Adjust transparency
ctx.globalAlpha=0.2;
ctx.fillStyle="blue";
ctx.fillRect(50,50,75,50);
ctx.fillStyle="green";
ctx.fillRect(80,80,75,50);
syntax
context.globalAlpha=number;
attribute value
| value | description |
|---|---|
| number | Valeur de transparence. Elle doit être comprise entre 0.0 (complètement transparent) et 1.0 (opaque). |
Détails techniques
| Valeur par défaut : | 1.0 |
|---|
Support du navigateur
Les numéros dans le tableau indiquent la version du navigateur qui prend en charge cette propriété pour la première fois.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Remarque :Les versions 8 et antérieures d'Internet Explorer ne prennent pas en charge l'élément <canvas>.
