Get our posts emailed to you with our monthly newsletter, subscribe here.

On a recent project I needed to serve an image as a full size background on both a page and a block level element, the image had to be scaled correctly and also be responsive on small devices.

Serving fullsized images onto backgrounds or block level elements can pretty much be done with pure CSS3, however I wanted to explore what possibilities and improvements jQuery offered in terms of serving a better quality image and handling different device sizes.

Here are ten jQuery plugins that are perfect for serving fullwidth image backgrounds, I personally chose to use the Backstretch plugin.

bgStretcher

jQuery Anystretch

Backstretch

Supersized

bgndGallery

Fullscreen

My Floating BG

Parallax

Fitmg

GalleryJack

Posted by David Martin

David Martin is a WordPress developer & entrepreneur from the UK. He owns DesignWoop, CardDsgn and WhoDesignToday. Catch up with David on Twitter.