This plugin was created on the concept un-blurring a part of image using SVG.
Best jQuery Image Effects Plugins & Tutorials with Demo
Water Ripple effect jQuery plugin
I was always fascinated by the “water ripple effect” and so it was time to deal with it. The result is a small jQuery plugin, which you can easily integrate into your projects. As with my last jQuery plugins, you can use the “water ripple effect” with, or without jQuery. As a zip and minifiert is this plugin only 2KB large.
Object Fit Images : JavaScript Polyfill for Object-fit & Object-position
Polyfill object-fit and object-position on images on IE9, IE10, IE11, Edge, Safari, etc.
Features:
- Fast and lightweight
- No additional elements are created or necessary
- Once set, position is taken care by the browser
srcsetsupport- You can still access/change
srcandsrcsetproperties and attributes:img.src = 'other-image.jpg'
Little Fragments: Simple Image Poster Effect with CSS & JavaScript
A tutorial on how to create a simple image effect with little image fragments inspired by some poster art and powered by clip-path.
The inspiration comes from a poster of the Grand Canyon with a fun distortion-like effect: some pieces of the image are cut out and placed in a different position. The pieces are very small which creates an interesting and creative look. We’ll be showing you today how to create a similar effect with CSS and some JavaScript.
Background Segment Effect with CSS & Anime.js
Today we’d like to share a little decorative effect with you that we’ve encountered on Filippo Bello’s Portfolio, maybe you’ve seen it. It’s a really neat way to add some jazz to background images. The idea is to replicate boxes from a background with the same background image and make these boxes move in perspective towards the viewer. Adding a fitting shadow and some parallax makes all this look quite interesting. Furthermore, we’re employing anime.js, the easy-to-use JavaScript animation library by Julian Garnier.
