Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Javascript remove background color and opacity

How can I remove the background-color and opacity property using Javascript only (no Jquery!).

I tried this:

document.getElementById('darkOverlay').style.removeProperty("background-color");
document.getElementById('darkOverlay').style.removeProperty("opacity");

but it did not work.

like image 671
utdev Avatar asked Nov 02 '16 13:11

utdev


People also ask

Can you lower opacity of background on JavaScript?

JavaScript – Change the Opacity of HTML Element To change the opacity of a HTML Element using JavaScript, get reference to the HTML Element element, and assign required opacity value to the element. style. opacity property. Opacity value ranges from 0 to 1.

How do I make background color transparent?

To set the opacity of a background, image, text, or other element, you can use the CSS opacity property. Values for this property range from 0 to 1. If you set the property to 0, the styled element will be completely transparent (ie. invisible).

How do I make a div transparent but not the text?

The percentage of opacity is calculated as Opacity% = Opacity * 100 To set the opacity only to the background and not the text inside it. It can be set by using the RGBA color values instead of the opacity property because using the opacity property can make the text inside it fully transparent element.


1 Answers

You can just reset properties by either setting them to an empty string:

document.getElementById('darkOverlay').style.backgroundColor = "";
document.getElementById('darkOverlay').style.opacity = "";

Or setting them to the default values you like:

document.getElementById('darkOverlay').style.backgroundColor = "transparent";
document.getElementById('darkOverlay').style.opacity = "1";
like image 79
andreas Avatar answered Nov 05 '22 06:11

andreas