Resizable Page Background Images

Posted by Lance Hayden, Creative Director

Large images have always been striking backgrounds for websites.  For Ridge Global, a risk management and energy consulting firm headed by former Pennsylvania Governor and Secretary of the U.S. Department of Homeland Security Tom Ridge, aerial photographs of large cities (suggesting a watchful eye and concern for safety) provided the perfect feel for the page backgrounds of their new site.

It used to be that designers could be safe using 1200 pixel wide images for page backgrounds (knowing that the user’s browser would likely never extend past that width). But as screen resolutions have blown past those 1200 pixels, instead of using a static image that fades to a solid color, a better solution is to dynamically resize the image to the dimensions of the browser (having the image fill the entire frame).

Before the rise of jQuery, an effect like this was difficult to achieve for most front end developers. Now, there are many methods to accomplish this effect; some of which can be animated and don’t even rely on JavaScript.

Check out the NEW RidgeGlobal.com >

Share |

thoughts, information and musing from the orange juice-drinking, brand-focused, politically-inspired, communications & digital fanatics at k-global.

recent posts: