HTML | canvas globalAlpha Property
The globalAlpha property is used to set or return the current alpha or transparency value of the drawing. The value must be a number between 0.0 to 1.0.
Here, 0.0 denotes fully transparent and 1.0 denotes no transparency. By default it is 1.0.
Syntax:
context.globalAlpha=number
Property values:
- number: It is the value between 0.0 to 1.0.
Example:
<!DOCTYPE html> < html > < body > < h3 style = "color:green" >GeeksforGeeks</ h3 > < h3 >HTML canvas globalalpha property</ h3 > < canvas id = "myCanvas" width = "200" height = "200" style = "border:2px solid ;" > </ canvas > < script > var can = document.getElementById("myCanvas"); var gfg = can.getContext("2d"); gfg.fillStyle = "green"; gfg.fillRect(50, 50, 95, 50); //Turn transparency on gfg.globalAlpha = 0.5; gfg.fillStyle = "green"; gfg.fillRect(50, 100, 95, 50); </ script > </ body > </ html > |
chevron_right
filter_none
Output:
Browsers supported:
- Chrome
- Internet Explorer 9.0
- Safari
- Firefox
- Opera