https://github.com/httpstersk/image-mask
A Polymer element for masking the images with basic (and some extraordinary) geometric shapes
https://github.com/httpstersk/image-mask
Last synced: 7 months ago
JSON representation
A Polymer element for masking the images with basic (and some extraordinary) geometric shapes
- Host: GitHub
- URL: https://github.com/httpstersk/image-mask
- Owner: httpstersk
- Created: 2014-05-03T17:18:20.000Z (about 12 years ago)
- Default Branch: master
- Last Pushed: 2017-09-22T14:16:49.000Z (almost 9 years ago)
- Last Synced: 2025-04-11T22:11:38.037Z (about 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 66.4 KB
- Stars: 29
- Watchers: 5
- Forks: 8
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# <image-mask>
> A Polymer element for masking the images with basic (and some extraordinary) geometric shapes
## Demo
[Check it live!](http://hejty.github.io/demos/image-mask/)
## Install
1. Install from npm registry:
```sh
npm install polymer-image-mask
```
## Usage
1. Import Custom Element as a script with type `module` or `ES` module:
```html
```
```js
import { ImageMask } from 'polymer-image-mask';
```
2. Start using it!
```html
```
## Options
Attribute | Description | Options | Default
--- | --- | --- | ---
`shape` | The `shape` attribute sets a masking shape | `circle`, `triangle`, `square`, `hexagon`, `octagon`, `star`, `rhombus`, `parallelogram`, `plus`, `squircle`, `ring` | `circle`
`size` | The `size` attribute sets a size of an element | *int* | `320`
`src` | The `src` attribute defines a path to an image that will be masked | *string* | `http://placehold.it/320`
`title` | The `title` attribute sets a short description of an image | *string* | `-`
`desc` | The `desc` attribute sets a long description of an image | *string* | `-`
## Example
```html
```
## Contributing
1. Fork it 🍴
2. Create your feature branch: `git checkout -b my-freaking-cool-feature`
3. Commit your changes: `git commit -m 'Add some freaking cool feature'`
4. Push to the branch: `git push origin my-freaking-cool-feature`
5. Submit a pull request ☝️
## History
For detailed changelog, check [Releases](https://github.com/hejty/image-mask/releases).
## License
[MIT License](http://opensource.org/licenses/MIT)