Skip to content

Instantly share code, notes, and snippets.

@shirokuro331
Last active December 18, 2015 00:39
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save shirokuro331/5698477 to your computer and use it in GitHub Desktop.
Save shirokuro331/5698477 to your computer and use it in GitHub Desktop.
Retina 対応 mixin
$spriteName: sprite-map("folder/*.png", $spacing: 5px);
@mixin sprite-hoge($name){
background-image: $spriteName;
background-repeat: no-repeat;
width: image-width(sprite-file($spriteName, $name)) / 2;
height: image-height(sprite-file($spriteName, $name)) / 2;
$ypos: round(nth(sprite-position($spriteName, $name), 2) / 2);
background-position: 0 $ypos;
background-size: round(image-width(sprite-path($spriteName)) / 2) round(image-height(sprite-path($spriteName)) / 2);
}
.no1{
@include sprite-hoge($name);
}
@shirokuro331
Copy link
Author

round ってのは四捨五入らしい。
http://kanapple.net/study/archives/17

@shirokuro331
Copy link
Author

@shirokuro331
Copy link
Author

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment