Skip to content

Instantly share code, notes, and snippets.

@itzaks

itzaks/_mixins.jade

Created May 12, 2014 12:23
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save itzaks/9511bd41b6f958a30747 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save itzaks/9511bd41b6f958a30747 to your computer and use it in GitHub Desktop.
Download ZIP
IE8 polyfill for 'background-size: cover'
Raw
_mixins.jade
- var background = function(url) {
- return "background-size: cover; background-image: url('" + url + "'); -ms-filter: \"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + url + "', sizingMethod='scale')\";";
- }
@itzaks
Copy link
Author

itzaks commented May 12, 2014

Usage:

include _mixins
.page
    .page-image(style=background(post.image.url))

@itzaks
Copy link
Author

itzaks commented May 12, 2014

Ruby helper:

def background(url)
  "background-size: cover; background-image: url('" + url + "'); -ms-filter: \"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + url + "', sizingMethod='scale')\";"
end

Usage:

.hero(style=background(@campaign.attachment.url))

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