Skip to content

Files

Latest commit

9c6407a · Oct 13, 2013

History

History
40 lines (27 loc) · 1.07 KB

README.md

File metadata and controls

40 lines (27 loc) · 1.07 KB

Vague.js is an experimental script that allows you to blur any kind of html element thanks to the SVG filters. This script is crossbrowser and it was tested on:

  • Firefox 10 +
  • Chrome 18 +
  • Safari 6.0 +
  • IE 7 +

DEMO

http://codepen.io/GianlucaGuarini/pen/Hzrhf

http://gianlucaguarini.github.io/Vague.js/

SHOWCASE

Atanas Mahony's website (click on any image)

Dependency

jQuery

USAGE

	var vague = $(yourelement).Vague({
		intensity:3 //blur intensity
	});
	vague.blur();

#API (public methods)

  • blur : blur the element selected.
  • unblur : unblur the element selected.
  • destroy : fires the unblur event and removes the svg filter from the DOM (whether it is needed)

#KNOWN ISSUES

  • currently the svg filters are not complitely supported by all the modern browsers http://caniuse.com/svg-html
  • currently on Opera 12 it doesn't work at all because it doesn't support SVG filters over HTML contents
  • on IE10 it doesn't work because IE still sucks