Blur - SVG blur applied to SVG image element
Image inserted via SVG with a SVG blur filter applied on hover
HTML
<svg id="svg-image-blur">
<image x="10" y="10" id="svg-image" width="auto" height="auto" xlink:href="http://css-plus.com/examples/2012/03/gaussian-blur/i/fence.jpg" />
<filter id="blur-effect-1">
<feGaussianBlur stdDeviation="2" />
</filter>
</svg>
CSS
#svg-image-blur { height: auto; width: auto; }
#svg-image:hover { filter:url(#blur-effect-1); }