Item Blur Effect

A reverse hover blur effect created with CSS 3 and jQuery, a trick to help draw the user's attention and focus towards the hovered element
The blur effect is achieved using CSS 3 features like transitions, transforms and box shadows.

The Item Blur Effect works this way. When hovering the mouse over an element, instead of blurring the hovered element, the other page elements within the same container are blurred out, to put focus on the actively hovered one.

Item Blur Effect can be used for page sections where elements are displayed in a repetitive manner, mainly to help the user notice details about the hovered element.

A demo page is included with the download package.

last updated on:
January 16th, 2014, 15:26 GMT
price:
FREE!
developed by:
Tympanus
license type:
Other Free / Open Source License
operating system(s):
Windows / Linux / Mac OS / BSD / Solaris
category:
C: \ Graphics and Multimedia \ Graphics and Animations

FREE!

In a hurry? Add it to your Download Basket!

user rating 2

UNRATED
5.0/5
 

0/5

1 Screenshot
Item Blur Effect - The background elements are blurred out whenever the user hovers one element from the same set

Add your review!

SUBMIT