jquery.
backgroundSize . js

Introduction

background-size: cover; scales an image to cover entirely the background of a target element (the body of this page is styled this way).

background-size: contain; scales an image to make it as big as possible but always entirely visible (or contained) in the background of a target element (this box is styled this way).

background-size is available in IE9+, Firefox, Chrome, Safari and Opera. Unfortunately, progressive enhancement doesn't work very well here: IE6-7-8 users would see a broken website.

jquery.backgroundSize.js is a 1.5k jQuery plugin that provides a fallback for those browsers:
$(elem).css({backgroundSize: "cover"});

Play with this Demo, read the Documentation, Download the script and give it a try!

Demonstration

Resize your browser to see how the background images are affected on this page.

  Check what IE6-7-8 users would normally see.

  Switch "cover" to "contain" and vice versa.

  Change the background image of the body.

  Animate the size of this box.

NB: this page shows emulated background-size to all browsers but it's possible to use CSS first, then load & use this library in conditionnal comments.