Backgroung color fade
# February 12, 2011 at 5:00 pm
Here is a simple explanation, the bgcolor starts yellow and then fades to green and then to yellow..etc the fading effect starts with no even (no buttons). I saw this effect somewhere, I don’t remember the site name at the moment.
Mêtah# February 12, 2011 at 6:19 pm
Another way it is done is with an image. Usually an image is 1px wide and then however tall you want the gradient to run down the page. The css would specify repeating the 1px wide image horizontally over the page so it will show in the browser as covering the whole area.
background: #ffffff url(“images/image.jpg”) repeat-x;
Or you could make a 1px high image and repeat it vertically. Which would make a horizontal gradient.
The gradient image itself is often made in image editors like photoshop or gimp or
. There is a css only solution which Sirlon points out in his links but you’ll probably want to create a fallback image as well for older browsers so a gradient effect is still achieved. Also the edge of your gradient could be a solid color which you could match to a solid background if you want it to fade and still look nice (especially if the user has a high resolution monitor).# February 13, 2011 at 2:38 am
Hi Sirlon and Rcobb3 and thank you, I don’t mean a CSS gradient.
I wont use images for the background. I’ll try to explain my problem one more time, I need to make the background ‘color’ (BGcolor) fade from one color to another (exemple: starts as #ffffff then after some seconds fade to #000000, I believe it needs a js function but not all the web browsers will be able to view it. The background color change from one color to another..
I’m sorry for my bad english, I hope you understand what I mean :)
Thank you again.# February 3, 2012 at 1:34 pm
Okay so if I am understanding you correctly you want your page to shift from one color to another? Well if you want the color to continually change you can use a 1px wide gif image. Use a image editor and make the variation of colors you want during the shift and then use http://picasion.com/ to make it into a gif. Then just do like rcobb3 said.
Just to clarify what I mean by “Use a image editor and make the variation of colors you want during the shift and then use http://picasion.com/ .”
picasion.com compiles multiple images into a gif image. So make multiple images of the colors you want for the fade to and from the final color. Where ever you put this image the color will continually shift.
Here is a code generated by picasion, I used 5 jpg images to generate the affect. You can also just save any image you generate to you computer. There is a max number of images that you can use. Picasion has a 10 image limit. I don’t have Photoshop or anything so one of the image creators may have a similar function.# February 4, 2012 at 12:25 am
This reply has been reported for inappropriate content.# July 18, 2016 at 11:22 am
You must be logged in to reply to this topic.