I have a view privacy policy. I added the opacity for my div but now I don't know how to remove the opacity. I am trying with remove the attribute but its not working. Can someone kindly assist me? Its a very urgent requirement.
<script type="text/javascript">
function show(id)
{
if(document.getElementById("wrapper")) //check the element exists and can be accessed
{
var ele = document.getElementById("wrapper");//get hold of the element
if(ele.style.visibility=="visible")//see if display property is set to none
{
}
else
{
ele.style.visibility="visible";
document.getElementById('LOGIN').style.opacity = 0.4;
}
}
}
function hide(id)
{
if(document.getElementById("wrapper"))//check the element exists and can be accessed
{
var ele = document.getElementById("wrapper");//get hold of the element
if(ele.style.visibility=="visible")//see if display property is set to none
{
ele.style.visibility="hidden";
}
else
{
}
}
}
</script>
<style>
#wrapper {
position:absolute;
z-index:1;
top:11%; bottom:5%; left:4%;right:15%;
width:87%;
height:75%;
font-size:15pt;
border:5px solid orange;
border-radius:25px;
overflow:auto;
visibility:hidden;
background-color:#ffffff;
}
#LOGIN.faded {
opacity: 0.5;
}
</style>
</head>
<body >
<div id="LOGIN" align="center">
<table width="100%">
<tr>
<td>
<input type="image" src="../images/header-sign-up.png" style="width:100%" alt=""/>
</td>
</tr>
</table>
<div align="center">
<a href="#" onclick ="show('showhide');">View privacy policy</a>
</div>
</div>
<div id="wrapper">
<div id="scroller" >
<div id="popupContact" >
<a href="#" onclick ="hide('showhide');">Close Window</a><br/>
<p>
biler Privacy Policy
Please feel free to contact us with any ments, questions, plaints or suggestions you might have regarding the information practices described in this statement. You may send us an e-mail at
</p>
</div>
</div>
</div>
</body>
</html>
I have a view privacy policy. I added the opacity for my div but now I don't know how to remove the opacity. I am trying with remove the attribute but its not working. Can someone kindly assist me? Its a very urgent requirement.
<script type="text/javascript">
function show(id)
{
if(document.getElementById("wrapper")) //check the element exists and can be accessed
{
var ele = document.getElementById("wrapper");//get hold of the element
if(ele.style.visibility=="visible")//see if display property is set to none
{
}
else
{
ele.style.visibility="visible";
document.getElementById('LOGIN').style.opacity = 0.4;
}
}
}
function hide(id)
{
if(document.getElementById("wrapper"))//check the element exists and can be accessed
{
var ele = document.getElementById("wrapper");//get hold of the element
if(ele.style.visibility=="visible")//see if display property is set to none
{
ele.style.visibility="hidden";
}
else
{
}
}
}
</script>
<style>
#wrapper {
position:absolute;
z-index:1;
top:11%; bottom:5%; left:4%;right:15%;
width:87%;
height:75%;
font-size:15pt;
border:5px solid orange;
border-radius:25px;
overflow:auto;
visibility:hidden;
background-color:#ffffff;
}
#LOGIN.faded {
opacity: 0.5;
}
</style>
</head>
<body >
<div id="LOGIN" align="center">
<table width="100%">
<tr>
<td>
<input type="image" src="../images/header-sign-up.png" style="width:100%" alt=""/>
</td>
</tr>
</table>
<div align="center">
<a href="#" onclick ="show('showhide');">View privacy policy</a>
</div>
</div>
<div id="wrapper">
<div id="scroller" >
<div id="popupContact" >
<a href="#" onclick ="hide('showhide');">Close Window</a><br/>
<p>
biler Privacy Policy
Please feel free to contact us with any ments, questions, plaints or suggestions you might have regarding the information practices described in this statement. You may send us an e-mail at
</p>
</div>
</div>
</div>
</body>
</html>
- 2 turn opacity value to 1.0 ? Also see quirksmode/js/opacity.html to make it work in IE – DhruvPathak Commented Aug 27, 2012 at 6:15
3 Answers
Reset to default 3Try opacity as you already have, or display...
document.getElementById('varContent').style.opacity = 0;
document.getElementById('varContent').style.opacity = 1;
or
document.getElementById('varContent').style.display = 'none';
document.getElementById('varContent').style.display = 'block';
You have to make the opacity value 1.
with web kit based browsers setting opacity of 1 will (unnecessarily ) slow down down the display (especially when scrolling content with opacity 1 over a background image)
better remove the property altogether (either using "removeProperty" method if you are certain it is available (IE 9 or better):
element.style.removeProperty("opacity")
or, more patible:
element.style.opacity = ""