Not signed in (Sign In)
SkillShare - A place to discuss Web Standards and Web Design topics
Categories
Vanilla 1.1.5a is a product of Lussumo. More Information: Documentation, Community Support.
-
Hello all,
This is my first post on this forum, glad to be finally participating, I hope my troubles bring light to some others who might encounter the same problem. I have set up a test site here. Here's what's going on:
I am trying to apply the Opacity style to a few div's. It is apparently necessary that the affected div's have their hasLayout property set to true, which I am doing by floating them and applying fixed dimensions to them. Should be fine! Firefox and Safari have no problem rendering the effect I'm hoping for. However, IE 6 and 7 and Opera seem to be very unhappy about it as they don't render it as I'm expecting. Does anybody have an explanation for this? What's wrong with my code?
A big thanks in advance to anybody who'll bring something to this thread!
Max -
Hi MaxBlack,
you're using javascript to set the opacity, is that necessary? However, IE doesn't understand the css option 'opacity', so your javascript line:
'item.style.opacity = 0.15;'
has no effect. IE needs this:
'item.filter = "alpha(opacity=0.15)";'
I'm using Opera, is that, what you expect your page to look like? Because from what I know, Opera understands the 'opacity' option and doesn't need special treatment. Further: I've never heard something about a so called 'hasLayout' attribute of html elements. All I know, is that IE needs fixed width and height to render opacity correctly.
Dave. -
Hello,
Sorry I haven't wrote back in a while. I just tried that and it stills doesn't work, I still can't do what I intend, even though my target elements HAVE layout.
But to answer your question, the screenshot you're providing is what i'm aiming for.
Anyway, at this point, i think i'm giving up, i'm out of ideas. :( Thanks for trying and replying, really! :)
Max -
hasLayout is irrelevant to this issue.
You just need the CSS...
#yourobject{filter:alpha(opacity=30);opacity:0.30}
If you want to get a handle...
Here is a fragment of JavaScript code from one of mine...
{fade+=1;if(ms)logo.filter="alpha(opacity="+fade+")";else logo.opacity=(fade/100)}
Set "ms" as a truth value using onload (or subsequent function) and an element that has been defined and specified in CSS...
<script>ms=(logo.opacity==0)?0:1</script>.
This is the Ternary Operator in action... doesn't actually matter, in this case, what the opacity definition is... it's a feature test.
1 to 4 of 4