jQuery.fluxoModal is a jQuery plug-in similar to lightbox. It can highlight any kind of html element inside an html modal window, blurring the background using html5 canvas, CSS3 animations and a crossbrowser fallback for IE.
Best jQuery Blur Effect Plugins & Tutorials with Demo
Picanim – jQuery image hover effect pulgin
Picanim is jQuery plugin used to bring stylish image hover.
Features:
- 27+ unique hover effects
- include: such as grayscale blur transparent fadeIn slice fold boxRandom boxRandom boxDiagional…
- small size,just 3kb after gziped
- cross browser
- you can easliy config the effect with a lot of options
- also support the img tag with a specific width or height
- easy to use
- can show tooltip on image
- with mouseout reverse effect
Pixastic: JavaScript Image Processing Library
Pixastic is an image processing library written in JavaScript. It uses the HTML5 Canvas element to apply effects such as blur, hue/saturation adjustment, emboss, invert, flip, etc.Pixastic is an experimental library which allows you to perform a variety of operations on images using just a bit of JavaScript. The effects supported out of the box include desaturation/greyscale, invert, flipping, brightness/contrast adjustment, hue/saturation, emboss, blur, and many more.
Hoverizr : A responsive jQuery Image manipulation and overlay plugin
Hoverizr is a really small (2.5KB minified) responsive jQuery plugin that outputs manipulated images on top (or below) your targeted images. Currently, it features three effects: grayscale, blur and color inversion. Automatically when you move your mouse over the target elements, the element above fades out to reveal the element beneath whether it is the original image or the manipulated one.Hoverizr takes advantage of the <canvas> element to do all the image processing.
Item Blur Effect with CSS3 and jQuery
Today we want to show you how to create a simple blur effect for text-based items. The idea is to have a set of text boxes that will get blurred and scaled down once we hover over them. The item in focus will scale up. This will create some kind of “focus” effect that drwas the attention to the currently hovered item.
We’ll be using CSS3 transitions and some jQuery to apply the respective classes. Since CSS3 transitions are not supported in order browsers, the demo should be best viewed in Safari or Chrome (here we got the smoothest transitions).
