hello
im trying to make a background effect similar to the one on www.noupe.com
i have tried looking for a 3 piece background tutorial
i want the head to have a background image that fades to a solid color
then the solid color will fill the middle depending on the height of the page
and the bottom to have a footer image but in the background
anyone have a tutorial or can help
Do keep in mind that designs like the one you linked to are very heavy and inflexible, so I’m not sure it’s a good direction to take. That’s a trend that’s slowly but gradually becoming obsolete due to the manifold restrictions such designs bring with them.
Anyway, there’s nothing a tutorial could teach you, which is why you haven’t found any tutorials. This is a typical “Photoshop-first” design approach, so if you’re looking to do something similar, you’d do that in Photoshop. Design the graphics for your header and footer, code the CSS and HTML, then go back to your PS mockup and crop the header and footer from the rest and integrate these into your HTML/CSS. You’ll need to work with positioning and stacking orders if you want to lay graphic elements over one another, but other than that, there’s nothing else to it.
I’d suggest against going that route, however, because these type of designs are outdated.
i do understand that people are trying to move away from this
however for the site im trying to build its pretty crucial to the design
i dont need to have the graphics on the main wrapper
i just want the back ground to be three parts with an elastic middle