/ResImg.js

Lightweight plugin for easy responsive images replacement

Primary LanguageJavaScriptMIT LicenseMIT

Use like so...

<img src = "images/world-placeholder.jpg" class="foo" id="bar" alt=""
data-src = "<400:images/world-small.jpg,
            <800:images/world-medium.jpg,
            <1200:images/world-large.jpg,
            <1600:images/world-huge.jpg,
            >1600:images/world-massive.jpg" />

specify as few or as many breakpoints as you wish

placeholder images are optional, chose one with dimensions ~ 1024x768px, size ~ 20kb

DEMO