jQuery responsImg Plugin Demos

For this demo, the allowDownsize attribute have been set to true, so that smaller sources are loaded when resizing the browser/img-tag to a smaller size.

Media Query mode

Go ahead and resize your browser :)
When you stop resizing, the image will change

$('.responsimg').responsImg({
  allowDownsize: true
});

Used on an image tag

Used on a background-image

Element Query mode

Click here to change make the image bigger
Click here to change make the image smaller

$('.responsimg-element').responsImg({
  elementQuery: true,
  allowDownsize: true
});

Keep in mind that this is the same tag. Only the width and height are changed.