THE WORLD'S LARGEST WEB DEVELOPER SITE

Style opacity Property

❮ Style Object

Example

Make a DIV element transparent:

document.getElementById("myDIV").style.opacity = "0.5";
Try it Yourself »

Definition and Usage

The opacity property sets or returns the opacity level of an element.

The opacity-level of an element describes the transparency-level, where 1 is not transperant at all, 0.5 is 50% see-through, and 0 is completely transparent.


Browser Support

Property
opacity Yes Yes Yes Yes Yes

Note: IE8 and earlier supports an alternative, the filter property.


Syntax

Return the opacity property:

object.style.opacity

Set the opacity property:

object.style.opacity = "number|initial|inherit"

Property Values

Value Description
number Specifies the opacity. From 0.0 (fully transparent) to 1.0 (fully opaque)
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit

Technical Details

Default Value: 1
Return Value: A String, representing the opacity-level of an element
CSS Version CSS3

Related Pages

CSS reference: opacity property


❮ Style Object