element.style.opacity -= .05 why can't I do that?

stedwick

I'm a JavaScript newbie.



element.style.opacity -= .05



That doesn't seem to work at all. It doesn't work with parseFloat either. Below is my whole function.



#Layer1 {

\topacity:1;

}

function fadeOut (elId) {

\tel = document.getElementById(elId)

\tel.style.opacity = parseFloat(el.style.opacity) - .5

};

<a href="#" onclick="fadeOut('Layer1')">here</a>



What am I doing wrong?



Of course, element.style.opacity = .5 works fine...but I want to set the opacity relative to what it is currently.



Also, alert(element.style.opacity) returns a blank alert, even though the opacity is CLEARLY set to 1 at the start.



Thanks!



Philip

project2501

This is actually more of CSS problem, and it is because CSS's design. Objects inherit their properties from their parents, and for some reason opasity is locked to between 0-100%, so when parent object has opacity set, you can only increase it, but not reduce it. Don't ask me why is it so, it just is.