0

I want to apply the following filter to some link element in my html page: My web page running on Chrome. (I found that filter somewhere on the net)

<filter id="tf" filterRes="172"> 
    <feImage xlink:href="noise.jpg"> 
    <feComposite in2="SourceGraphic" operator="arithmetic" k1="1"> 
    <feMorphology operator="erode" radius="30"> 
</filter>
  • I got the noise.jpg as a file in the root folder (where my index.html is)

  • The css is embedded in the html.index by the style element

In what file extension the filter should be saved?

How can I refer to that file in the css code?

Michael Mullany
  • 30,283
  • 6
  • 81
  • 105
Bush
  • 2,433
  • 5
  • 34
  • 57

1 Answers1

0

You have to include the filter in a SVG document (you can also embed it in your XHTML document), then you can simply refer to it in your CSS filter property by its URL, like this: filter: url(myfilter.svg#filterID).

On WebKit however it works only if the SVG filter is embedded in the document.

Carlo Cannas
  • 3,206
  • 19
  • 22