fullphaser Posted April 24, 2006 Share Posted April 24, 2006 a:visited {-moz-opacity:.6; opacity:.6; filter: alpha(opacity=60);}#subii{filter:alpha(opacity=70); -moz-opacity:.7; opacity:.7;} Is there any way to validate transparency with CSS2 and such? Link to comment Share on other sites More sharing options...
aspnetguy Posted April 24, 2006 Share Posted April 24, 2006 what part isn't validating??? -moz-opacity????Which browsers need -moz-opacity? FireFox reads opacity:.6 correctly. Link to comment Share on other sites More sharing options...
boen_robot Posted April 24, 2006 Share Posted April 24, 2006 It may display it correctly, but as fullphaser points out, it's not a vlid code we're talking about. Link to comment Share on other sites More sharing options...
aspnetguy Posted April 24, 2006 Share Posted April 24, 2006 It may display it correctly, but as fullphaser points out, it's not a vlid code we're talking about.<{POST_SNAPBACK}> opacity isn't a valid attribute??? I was asking if he really needed -moz-opacity since all browsers I have tested with don't need it. Link to comment Share on other sites More sharing options...
fullphaser Posted April 24, 2006 Author Share Posted April 24, 2006 Well the wierd thing is that it isn't validating any of that bit of CSS it seems anything that is even on the edge isn't considered valid and the -moz-opacity is similar to -khtml-opacity; it is designed for older versions of Firefox and Safari (or so I am told, that firefox<1.0 doesn't read opacity but wil read -moz-opacity or something to that effect, that is just what I am told) Link to comment Share on other sites More sharing options...
Chocolate570 Posted April 24, 2006 Share Posted April 24, 2006 You might want to look at this page. http://www.soxiam.com/Code/CSSCrossBrowserTransparency Link to comment Share on other sites More sharing options...
mpoer Posted April 24, 2006 Share Posted April 24, 2006 so I'm guessing #id {background:transparent;} is not valid? I've never used it, but I've seen it done and wondered about it. Link to comment Share on other sites More sharing options...
fullphaser Posted April 24, 2006 Author Share Posted April 24, 2006 You might want to look at this page. http://www.soxiam.com/Code/CSSCrossBrowserTransparency<{POST_SNAPBACK}> Right and the code displays correctly crossbrowser wise but it is the W3 Validation that concerns me considering that it is all technically CSS3 (or atleast that is how I understood things to be) Link to comment Share on other sites More sharing options...
yoshida Posted April 25, 2006 Share Posted April 25, 2006 It's an amazing feature, but if you nest divs the 'inner' divs inherit that property. It 'ruins' my hack to add a dropshade to a div. So now if I decide to add a background the entire textarea is transparant instead of just the dropshade. IMHO that kinda sucks. All 'cheesehacks' are sticky anyway... Link to comment Share on other sites More sharing options...
vchris Posted April 25, 2006 Share Posted April 25, 2006 I've never really worked with transparency... I'm playing with it right now and I see that the text inside a div also gets affected by the transparency. How do I have text 100% opacity and div background to 20%???Edit: NVM found it on that link. Link to comment Share on other sites More sharing options...
Jonas Posted April 25, 2006 Share Posted April 25, 2006 You might want to look at this page. http://www.soxiam.com/Code/CSSCrossBrowserTransparency<{POST_SNAPBACK}> CrossBrowserTransparency? Funny that. Link to comment Share on other sites More sharing options...
fullphaser Posted April 25, 2006 Author Share Posted April 25, 2006 CrossBrowserTransparency? Funny that.<{POST_SNAPBACK}> Heh, yeah well enough so that IE 6.0 and Firefox 1.5 and Opera 8 can all read it all other browsers mean nothing Link to comment Share on other sites More sharing options...
yoshida Posted April 26, 2006 Share Posted April 26, 2006 I adapted a fullscale background topic to make something that might serve your needs. Here's the CSS: body { font-family:verdana, arial, sans-serif; font-size:76%; margin:0; padding:0; width:100%; height:100%; overflow:hidden; background-image: url(http://www.seemydesign.com/livingroom/elementsideas/designelements/pattern/fabric_types/speckle_mauv_m.jpg);}#transparant { position:absolute; z-index:1; width:80%; height:80%; padding:20px; opacity:0.3; background-color:#ffaaff;}#scroller { position:absolute; width:80%; height:80%; top:0; left:0; overflow:auto; z-index:2; background-color:#aaffff;} #content { background-color:ffffaa; margin-right:30px; margin-left:30px; margin-top:10px; margin-bottom:10px;} And here's the HTML: <html><head><link rel=stylesheet type="text/css" href=transparency.css></head><body><div id=transparant></div><div id=scroller><div id=content>Insert content here</div><div id=content>Insert new content here</div></div></body></html> What I'm doing is putting one div on top of another. Here's what it might look like. It's quick & messy but there's plenty of brains on these forums to make it into something pretty. Knock yourselfs out.EDIT as it appears, this thing doesn't seem to work with IE6 but I have no problems using Firefox 1.5. Using IE6, the transparant background div doesn't show up. Link to comment Share on other sites More sharing options...
Jonas Posted April 26, 2006 Share Posted April 26, 2006 Heh, yeah well enough so that IE 6.0 and Firefox 1.5 and Opera 8 can all read it all other browsers mean nothing <{POST_SNAPBACK}> Opera 8 doesn't support opacity.http://www.domedia.org/oveklykken/css-transparency.phpLook at that site in Firefox and Opera, and compare. Link to comment Share on other sites More sharing options...
fullphaser Posted April 26, 2006 Author Share Posted April 26, 2006 Opera 8 doesn't support opacity.http://www.domedia.org/oveklykken/css-transparency.phpLook at that site in Firefox and Opera, and compare.<{POST_SNAPBACK}> Oh, heh I could have sworn It was reading what was I smoking? hmm... thats odd... I thought for sure that it was supporting it on an older version of the site. Link to comment Share on other sites More sharing options...
Jonas Posted April 26, 2006 Share Posted April 26, 2006 You must have been smoking something, cause Opacity won't be supported until Opera 9.0 (look up "Display".:)Maybe you were viewing it in Opera 9.0 Beta? I dunno... Link to comment Share on other sites More sharing options...
yoshida Posted April 27, 2006 Share Posted April 27, 2006 In any case, there's too little consistency in css support for browsers. IE6 sucks big time if you have to write a fancy css to work for that, FireFox (1.5) works just fine (it's a browser you can actually have a 'conversation' with) and Opera seems to care more about it's own versatility and usability than about plugin support.I dunno... it just feels like CSS support should be a plugin like Javascript or Flash. Something not much unlike a GNU module, which you can get documentation and dev modules for.These kinds of fora sure makes it a lot more easy to get what you're looking for. My webpage now has an 'about' section which states the site is written for FF1.5 and adapted for IE6. Couldn't have done it without your help.This fancycat has learned a whole new batch of tricks and I owe you guys. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now