Skip to content

Instantly share code, notes, and snippets.

@nathancrank
nathancrank / backgroundImage.scss
Created August 16, 2012 01:37
Responsive Background Images
// backgroundImage takes a filename and uses the correct resolution version of it for a css background-image
// the base (1x) file should not have any extra ending on its name
// files should end in the following pattern: _1.5x, _2x, _3x, etc... (where "_" is the delimiter)
// $img takes the images path and name up until the file extention (not including the ".")
// $ext takes the images extention type, defaults to png
// $state is used to declare img states (active, hover, etc...)
// $max takes a numeric value at which to stop (default: 2)
// $inc takes a numeric value to increment the dppx at (default: 1)
// $min takes a numeric value at which to start (default: 1)
// $delim takes the delimiter style used (default "_")