-
Notifications
You must be signed in to change notification settings - Fork 22.4k
/
index.md
60 lines (44 loc) · 1.88 KB
/
index.md
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
---
title: "HTMLCanvasElement: mozOpaque property"
short-title: mozOpaque
slug: Web/API/HTMLCanvasElement/mozOpaque
page-type: web-api-instance-property
status:
- deprecated
- non-standard
browser-compat: api.HTMLCanvasElement.mozOpaque
---
{{APIRef("Canvas API")}}{{deprecated_header}}{{non-standard_header}}
The non-standard **`HTMLCanvasElement.mozOpaque`** property is
a boolean value reflecting the [`moz-opaque`](/en-US/docs/Web/HTML/Element/canvas#moz-opaque) HTML
attribute of the {{HTMLElement("canvas")}} element. It lets the canvas know whether or
not translucency will be a factor. If the canvas knows there's no translucency, painting
performance can be optimized.
> **Note:** This has been standardized as setting the `alpha` option to
> `false` when creating a drawing context with
> {{domxref("HTMLCanvasElement.getContext()")}}. Use of `mozOpaque` should be
> avoided. Firefox will stop supporting it in the future.
## Value
A boolean value.
## Examples
Given this {{HTMLElement("canvas")}} element:
```html
<canvas id="canvas" width="300" height="300" moz-opaque></canvas>
```
You can get or set the `mozOpaque` property. For example, you could
conditionally set it to `true` if `mimeType === 'image/jpeg'`, or
similar, to gain performance in your application when translucency is not needed.
```js
const canvas = document.getElementById("canvas");
console.log(canvas.mozOpaque); // true
// deactivate it
canvas.mozOpaque = false;
```
## Specifications
Not part of any standard.
## Browser compatibility
{{Compat}}
## See also
- {{domxref("HTMLCanvasElement")}}: Interface used to define the `HTMLCanvasElement.mozOpaque` property
- [`moz-opaque`](/en-US/docs/Web/HTML/Element/canvas#moz-opaque): HTML attribute of the {{HTMLElement("canvas")}} element
- [Optimizing your JavaScript game for Firefox OS](https://hacks.mozilla.org/2013/05/optimizing-your-javascript-game-for-firefox-os/)