https://github.com/herrmannplatz/cutout

jQuery plugin to create base64 image from a sprite sheet class
https://github.com/herrmannplatz/cutout

Last synced: about 2 months ago
JSON representation

jQuery plugin to create base64 image from a sprite sheet class

• Host: GitHub
• URL: https://github.com/herrmannplatz/cutout
• Owner: herrmannplatz
• Created: 2013-11-27T22:29:03.000Z (about 11 years ago)
• Default Branch: master
• Last Pushed: 2015-08-17T17:43:14.000Z (over 9 years ago)
• Last Synced: 2024-10-10T12:08:22.384Z (3 months ago)
• Language: JavaScript
• Homepage:
• Size: 254 KB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# cutout

Cutout extracts images from css sprite sheets. It will add the generated image as base64 encoded `background-image` to the specified element. This way you can use `background-size: cover` and `background-repeat: repeat` with the desired sprite.

Usage

------

Use your favourite sprite sheet tool to generate the sprite sheet.

```css 

.sprite {

  display:inline-block;

  overflow:hidden;

  background-repeat: no-repeat;

  background-image: url(css.png);

}

 

.background {

  width: 10px;

  height: 10px;

  background-position: -20px -150px

}

```

Call the `cutout` function on the desired jquery element with the css class for the sprite you want to extract.

```javascript

$('
')

  .cutout'"sprite background')

  .css({

    width: '1000px',

    height: '1000px',

    backgroundSize: 'cover'

})

.appendTo($('body'));

```