jQuery Anystretch

Anystretch is a jQuery plugin that allows you to add a dynamically-resized background image to any page or block level element. The image will stretch to fit the page/element, and will automatically resize as the window size changes.

Handy when having a fluid layout/responsive design.

Anystretch Demo →
Anystretch (GitHub) →

UPDATE: Reader Oemebamo pointed out that this can be achieved with CSS, using background-size: cover;. Turns out background-size is widely supported (thought it was Chrome only).

Join the Conversation


  1. Hi, I am trying to figure out how to get this to work on the background element.
    I would like the body{background-image: url(blablah.jpg);} to have a background image that behaves the same way this does in a div.Can anyone help me with this? I tried: $(‘body’).anystretch(“img01.jpg”); but it does not work right. The image has a padding applied and if there is not enough content to fill the screen the image disappears.

  2. I tried using Anystretch with Masonry and I could not get it to work correctly. Do you know why this would happen?

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.