Display the shadow of an image – Javascript Plugin
In this post I am going to share Simple and small Javascript plugin to display the shadow of the image. The Plugin provides a simple way to apply a drop shadow effect to any image and video using pure JavaScript.
Libraries
Load the plugin library form CDN
<script src="https://cdn.jsdelivr.net/gh/tunguskha/Image-shadow@latest/assets/js/image-shadow.js"></script> |
HTML
All you need is .ishadow
wrapper to the image and blur value in data attribute
<div class="ishadow"> <img class="img" data-blur="20" src="assets/imgs/halt-and-catch-fire.jpg"> </div> |
Also, you can make an element hoverable by adding data-hover="true"
.
false
by default
<div class="ishadow"> <img class="img" data-blur="20" data-hover="true" src="assets/imgs/halt-and-catch-fire.jpg"> </div> |
See live demo and download source code.
DEMO | DOWNLOAD
This awesome plugin is developed by tunguskha. Visit their official github repository for more information and follow for future updates.