Lib for dealing with different image sizes on different devices
JavaScript
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
css
js
.gitignore
README.md
index.html

README.md

Responsive Images Library

==================================

Library for delivering images based on screen size. Uses Modernizrs mq() for detecting breakpoints falling back to standard JS .innerwidth for getting screen size.

It can support as many breakpoints as you need just add the required width as a data attribute.

Installation

Applying the solution to images/elements is very easy, simply add a class of "responsive-image" to the element and add the following data attributes

  • data-320="path/to/image"
  • data-768="path/to/image"
  • data-1024="path/to/image"
  • data-1220="path/to/image"
  • data-1440="path/to/image"

Dependencies

Modernizr.js

A Library for feature detection. Using Modernizr.mq which tests a given media query, live against the current state of the window