In this tutorial we will show you how to create a simple image editor using jQuery, HTML5 and CSS.We use different CSS filter like Grayscale, Blur, Exposure(brightness), Sepia and Opacity to edit the image you can add more effects if you want.
Best jQuery Image Effects Plugins & Tutorials with Demo
mgGlitch.js : jQuery helper for Glitch
A little jquery helper to glitch everything.
- first element become a static background
- next element with glitch property and lower interval
- next element with glitch property, higher interval and scale options
- next element with glitch property, higher interval, scale options and blend mode apply
Simple Interactive Points Effect with SVG
Today we’d like to share a simple hover/click effect for images with you. The main idea is to show a map or a base image with some points of interest (POS) and when we come close to one of these points and hover, an image starts to fade in. When clicking on the POS indicator, a content layer is shown with some more information on that point; the background image becomes completely opaque. This concept could be fitting for some kind of map assisted story telling, like a travel piece or similar.
Grafi.js : JavaScript Image Processing Library
Grafi.js is a library intended for learning about how image processing works. Each modules are intentionally kept small and users are encouraged to read the source code to learn about different methods and algorithms. In result, grafi may not be the most performant or the most sophisticated image processing library, but that’s the point.
