HTML canvas globalAlphaPropiedad
Ejemplo
Primero, dibuja un rectángulo rojo, luego establece la transparencia (globalAlpha) a 0.5, y luego dibuja un rectángulo azul y uno verde:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="red";
ctx.fillRect(20,20,75,50);
// Turn transparency on
ctx.globalAlpha=0.2;
ctx.fillStyle="blue";
ctx.fillRect(50,50,75,50);
ctx.fillStyle="green";
ctx.fillRect(80,80,75,50);
var ctx=c.getContext("2d");
ctx.fillStyle="red";
ctx.fillRect(20,20,75,50);
// Turn transparency on
ctx.globalAlpha=0.2;
ctx.fillStyle="blue";
ctx.fillRect(50,50,75,50);
ctx.fillStyle="green";
ctx.fillRect(80,80,75,50);
Pruébalo »
Soporte del navegador
![]()
![]()
![]()
![]()
![]()
Internet Explorer 9, Firefox, Opera, Chrome y Safari soportan la propiedad globalAlpha.
Nota:Internet Explorer 8 y versiones anteriores no soportan el elemento <canvas>.
Definición y uso
La propiedad globalAlpha establece o devuelve el valor de transparencia actual del dibujo (alpha o transparencia).
El valor de la propiedad globalAlpha debe ser un número entre 0.0 (totalmente transparente) y 1.0 (opaco).
| Valor predeterminado: | 1.0 |
|---|---|
| Sintaxis de JavaScript: | context.globalAlpha=number; |
Valor de la propiedad
| Valor | Descripción |
|---|---|
| number | Valor de transparencia. Debe estar entre 0.0 (totalmente transparente) y 1.0 (opaco). |
Otras extensiones
Objeto Canvas