make an html svg object also a clickable link

anchor, html, object, svg

Solution

Actually, the best way to solve this is... on the <object> tag, use:

pointer-events: none;

Note: Users which have the Ad Blocker plugin installed get a tab-like [Block] at the upper right corner upon hovering (the same as a flash banner gets). By settings this css, that'll go away as well.

http://jsfiddle.net/energee/UL9k9/

Problem

I have an SVG object in my HTML page and am wrapping it in an anchor so when the svg image is clicked it takes the user to the anchor link. ``` <a href="http://www.google.com/"> <object data="mysvg.svg" type="image/svg+xml"> <span>Your browser doesn't support SVG images</span> </object> </a> ``` When I use this code block, clicking the svg object doesn't take me to google. In IE8< the span text is clickable. I do not want to modify my svg image to contain tags. My question is, how can I make the svg image clickable?

Original source