Full-size scalable website background image

For the tara-center.com website project I had to find a functional javascript to let me use a full-size scalable background image. Using the 100% width/height css property, it will results an ugly stretched background picture, that will un-proportionally fill the browser window. Definitely bad. So I started looking for alternative solutions and I found some Jquery scripts to achieve better results. Probably Supersized is the most famous one, it allows to slideshow a full-size background gallery with controllers (if multiple backgrounds) and captions; a similar one is maxImage slideshow, it works as single bg as well as gallery.

I found very useful the Galleria script, it allows thumbnail, automatic or manual slideshow, caption etc. Highly customizable, I love it!

In addiction to these ones, there are plenty of other free jQuery-based scripts available on the web, like bgstretcherfullscreen background (very fluid when resizing the browser window), flexible scalable background image and Backstretch.
There are also a couple of just-css solution like the one used in Go To China website (but it doesn’t work so well with Chrome) or Scaling fullsize background (that seemed perfect until I tested it with IE , damn)

Note that some browsers wait until after you’re done the window resizing to fire the event, giving a ugly transition between the two, so it’d be better to do a cross-browser-check with the preferred one before using it.

Keep surfing the web for other solutions, it’s full of plenty cool alternatives around!