Please! I need help!

katulu50

New Member
Hi, I was wondering how can I make a website having a fading background effect, please visit http://www.msn.com, and you'll notice that it's not like <body background = 'fade_image.jpg' repeat= x........> it seems to be a javascript code, so the background fits exactly with the screen resolution. Thanks. :confused::confused::confused:
 
If you're making a website with something like DreamWeaver, just use a program like Photoshop to make a gradient.

You can then use the gradient saved as a PNG on the background on your website.
 
If you're making a website with something like DreamWeaver, just use a program like Photoshop to make a gradient.

You can then use the gradient saved as a PNG on the background on your website.


he said:

it's not like <body background = 'fade_image.jpg' repeat= x........>

He wants the javascript code... :P
 
It ain't working

Thanks for the tip but it's not what I want, If you visit the example (http://www.msn.com), you'll see that it's a static background (gradient background), i'm sure it's not just an image because using the <body backgroud:gradiend-image.jpg background-repeat: repeat>; it will only show the image with a specific size. If the text, or content exceeds the size of the image it will start again, and it's not like the MSN website where you can see if the content exceeds it will only keep fading. Thanks again for your time, please let me know if you find out how can I do this.
 
Done

Thanks everybody for your help, I'm very sure this is the way to do that

1. Make a gradient image using two colors (top color blue / second color white) with 1 x 1024 dimension. (You have to know the hex code of each color).

2. Using a HTML Editor just have to put the background image... (if is a good HTML Editor it will generate a css embeded into the html).

3. Let the background repeat itself, using the background-repeat parameter.

4. Now pick a the website background color (We have to pick the color of the bottom of the gradient). White (#EEEEEE).

5. Done, now the background it's fading, and the content that exceeds the image resolution will have the fading effect. (Until the image ends, and then will only show the background-color that it's the same color of the gradient).

The CSS Generated Code is this:

<!--
body {
background-image: url(image/background.gif);
background-repeat: repeat-x;
background-color: #EEE;
}

Now you can put it on inside a .css file :D pretty much of your idea
 
Yes you fade the color (image).

That's why I love making websites, there are tons of ways to do one thing :D
 
guys , thanks for the topic, can anyone tell what is the tool for creating sch image? i have paint shop pro and photoshop , where on these programs i have to go to create something like this ?

View attachment 2230
 
Last edited:
I'm sure you can do gradients with photoshop.
I personally use Macromedia Fireworks 8 to do images but it's just like Photoshop. In Fireworks you can set the maximum size you want.
 
Back
Top