-
Jan 19th, 2006, 08:16 PM
#1
Thread Starter
Member
change background image opacity
without editing a background image for my web page in photoshop is there code to change the opacity of the background image, if so can u post the code and where to put it in my html document? gracias
-
Jan 20th, 2006, 05:25 AM
#2
PowerPoster
Re: change background image opacity
HTML Code:
<html>
<head>
<style>
div {
background-image:url(forest.jpg);
filter:alpha(opacity=20);
height:100%;
opacity:.90;
}
</style>
</head>
<body>
<div>some text here</div>
<img src="forest.jpg">
</body>
</html>
CSS can kinda do this..
I think Opacity is one of those things that isn't supported very well.. across all browsers (not sure if IE supports it at all)
You can't appear to specify an opacity for a page background (so <body background="url"> won't work), but if you wrap your page in a Div, you can set the opacity to the div and it should work (see my little test code as an example). I think you need to use opacity and filter, as IE understands filter (apparently) and FireFox seems to understand opacity... I dunno, have a read and see what you come up with
Heres a great article for you read up on it
http://www.mandarindesign.com/opacity.html
CB will be able to answer this better I'm sure
-
Jan 20th, 2006, 07:35 PM
#3
Re: change background image opacity
http://www.standards.spiralmindsinc..../css-testcase/
Demonstration of CSS opacity, among other things.
PcM is correct, IE uses filter (which is proprietary) and standards-compliant browsers recognise the opacity property.
Bear in mind that there is no "background opacity" as such. Opacity applies to an element and all its children. So if you want background opacity without child element opacity I suppose you would have to make the semi-translucent element and then overlay another non-translucent element (with no background) over that.
-
Jan 20th, 2006, 08:44 PM
#4
Re: change background image opacity
Or use a partially transparent PNG as background. Of course, that again requires you to use an IE filter, because otherwise the PNG isn't loaded properly.
All the buzzt
CornedBee
"Writing specifications is like writing a novel. Writing code is like writing poetry."
- Anonymous, published by Raymond Chen
Don't PM me with your problems, I scan most of the forums daily. If you do PM me, I will not answer your question.
-
May 4th, 2011, 01:53 AM
#5
New Member
Re: change background image opacity
Originally Posted by CornedBee
Or use a partially transparent PNG as background. Of course, that again requires you to use an IE filter, because otherwise the PNG isn't loaded properly.
This is the best idea i had used. Nice.
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|