1.0.0 • Published 5 years ago
cyberpunk-style-image v1.0.0
Cyberpunk Style Image
This simple plugin was an exercise to practice the clip-path property. With :hover
the image will alter some opacity and we apply a nice-looking hue-rotate effect.
Installation
yarn add cyberpunk-style-image
npm install cyberpunk-style-image --save
How to use it
Here's an example:
<!-- index.html -->
<div class="future-image-cover" data-img="image_url.png"></div>
// script.js
import cyberImage from 'cyberpunk-style-image';
cyberImage(document.getElementById('test'), './img/photo.jpg');
ToDo
- Responsive image
- Improve
:hover
effect
1.0.0
5 years ago