vikmalhotra
vikmalhotra

Reputation: 10071

Creating a fixed background for a website

I am trying to implement a fixed background for a website like one over here. Searching around for it told me that I can use background: fixed or background-attachment properties for this.

My problem is the image which will be used as background. I am thinking about following issues:

Can somebody guide me on these points?

Regards Vikram

Upvotes: 0

Views: 267

Answers (2)

Babiker
Babiker

Reputation: 18798

That is not a single background image. Its mostly a bgcolor, except for the side clouds. Using a single large image as a background will dramatically slow down your load time.

Upvotes: 2

Ken Redler
Ken Redler

Reputation: 23943

There's no specific guideline. You need to make the image as large as necessary to satisfy the requirements of the design. If you want someone with a maximized browser window on a 30-inch display to see a single unbroken non-repeating background image, then yes, you'll need quite a large image. It won't perform well.

The Twitter example is a wide but short image, set to repeat along its x-axis. It's wide at 2247 pixels, but perhaps unnecessarily so: it actually appears to be a fixed pattern that repeats horizontally four times within that 2247 pixel image. Nonetheless, you get the idea: make an image that blends gracefully into itself at its edges for seamless tiling, and/or blends into a fixed background color. Position and repeat it as needed, set the background-color of the page, and you're done.

Upvotes: 1

Related Questions