View Full Version : Complex question about CSS images...
texasmandie 02-13-2004, 03:37 PM Ok...I've seen a CSS page done, where there was a picture, that had been made slightly transparent so you could read text beneath it..and when you scroll down the text moves as normal, but the picture remains there....how do you do that???
Amanda
Owlie42 02-13-2004, 07:59 PM I'm confused. Do you have a link?
What it sounds like is that the background isn't moving. But I could be wrong. But if I'm right, in the body part of the stylesheet add:
background-attachment: fixed;
:)
texasmandie 02-13-2004, 09:08 PM Yes there is a link, but I'm uncertain how that would help, since I can't get what I'm attempting to do, to work. I think what I'm trying to do is called a floating image. Say you have a picture in the upper right corner of the page. Well when you scroll...it doesn't move...it says in the upper right corner of your screen while the text scrolls as normal.
Amanda
I'm confused. Do you have a link?
What it sounds like is that the background isn't moving. But I could be wrong. But if I'm right, in the body part of the stylesheet add:
background-attachment: fixed;
:)
texasmandie 02-13-2004, 09:36 PM Actually you know what...I got the floating part down...now I just need help making it transparent...
Amanda
Yes there is a link, but I'm uncertain how that would help, since I can't get what I'm attempting to do, to work. I think what I'm trying to do is called a floating image. Say you have a picture in the upper right corner of the page. Well when you scroll...it doesn't move...it says in the upper right corner of your screen while the text scrolls as normal.
Amanda
MaGiCSuN 02-13-2004, 09:53 PM do you want the image to be transparent at certain parts? if so, you will need a graphic program for that..
if not, explain a bit more since i'm really confused here
love,
Mirna
texasmandie 02-13-2004, 09:58 PM Nope...I want the whole image to be transparent..how do I do that?
Amanda
MaGiCSuN 02-13-2004, 11:15 PM what's the use of that then? if you want it fully transparent then you can better take out the whole image to get the same effect.
Or do you mean translucent? like i said, it's a bit confusing :S
Love,
Mirna
texasmandie 02-13-2004, 11:21 PM Err sorry ok..like you can see the picture, but you can read text through it.
Amanda
what's the use of that then? if you want it fully transparent then you can better take out the whole image to get the same effect.
Or do you mean translucent? like i said, it's a bit confusing :S
Love,
Mirna
fruitcake 02-14-2004, 08:41 AM As far as I know, you cannot make your background image transparent with CSS.
You can however, open up your image in your graphics editor, such as Photoshop, or Paint Shop Pro. You then want to add a layer in behind your "background" layer. If the program has your image layer named "background" you'll need to "promote to layer" or copy and paste a new layer, delete the old one. Now add in a layer below your image, fill it with WHITE, or another colour that will work with your background. Lower the OPACITY of the layer with your background image on it, you'll see the solid white through the image. Play with the adjustments until you have it like you want it, test out your text color over top of it and be sure it shows up well on all parts of the image.
Save, and you're set. Just add in the image to the background as you normally would.
texasmandie 02-16-2004, 04:12 PM Ok....let me try a different idea..and this I know can be done....how do you make it where the background image is set in place...but the text scrolls???
As far as I know, you cannot make your background image transparent with CSS.
You can however, open up your image in your graphics editor, such as Photoshop, or Paint Shop Pro. You then want to add a layer in behind your "background" layer. If the program has your image layer named "background" you'll need to "promote to layer" or copy and paste a new layer, delete the old one. Now add in a layer below your image, fill it with WHITE, or another colour that will work with your background. Lower the OPACITY of the layer with your background image on it, you'll see the solid white through the image. Play with the adjustments until you have it like you want it, test out your text color over top of it and be sure it shows up well on all parts of the image.
Save, and you're set. Just add in the image to the background as you normally would.
Rosey 02-16-2004, 04:48 PM You can take out your background-image from your css, and just put a regular <img> tag in your html like this:
<img src="whatever.jpg" style="position:absolute; top:0; left:0;">
Change the 0 to the number you want if you don't want it in the top left corner.
and then you can put a div layer or and iframe and absolute position it too.
|