No quiero agregar un enlace a un svg (que no es posible porque el svg no lo proporciono), pero quiero agregar un enlace como <a href=""><img src="foo.svg"/></a>. Solo que esta vez no es un img, sino un object (así puedo incluir un svg).¿Cómo insertar un objeto SVG en HTML con enlaces?
Funciona con algunos navegadores, pero por ejemplo no con Firefox. ¿Cuál es la idea predeterminada de cómo hacer algo como eso?
En Firefox <object> captura todos los clics y no los deja "burbujear" fuera del documento SVG. Una solución sensata es cubrir el SVG con otro elemento que obtiene el clic primero.
Afortunadamente esto se puede hacer con CSS puro:
a {position:relative; display:inline-block;}
a:after {content:""; position:absolute; top:0; left:0; bottom:0; right:0;}
Es posible que desee añadir pseudo-clase :-moz-any-link al selector para que sea de sólo Gecko.
poner el enlace dentro del archivo SVG en lugar, por ejemplo:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<a xlink:href="">
...
</a>
</svg>
Con svgweb puede incrustar arbitraria SVG entre navegadores, y modificarlo a través de métodos DOM regulares. Esto incluye adjuntar detectores de eventos a cualquier parte del SVG.
página de iniciosvgweb:
http://code.google.com/p/svgweb/
inicio rápido svgweb (también discute la adición de detectores de eventos):
http://codinginparadise.org/projects/svgweb/docs/QuickStart.html
Incluso si no se puede poner en una etiqueta de anclaje tradicional de esta forma (I no lo he probado, podría funcionar), al menos podrá manejar los eventos de clic y navegar en función de ellos, que es lo que realmente está buscando.
Javascript no es posible – user253104
... y si el archivo está alojado en el mismo dominio, y que realmente desea tener que cambiar el archivo en el servidor puede intentar algo como esto: var = AELM yourObjectElm.contentDocument.documentElement.createElementNS (" http://www.w3.org/2000/svg "," a "); aElm.href.baseVal = "http://your.link.here.com"; // ... anexe todos los hijos de yourObjectElm.contentDocument.documentElement a aElm ... // yourObjectElm.contentDocument.documentElement.appendChild (aElm); –
Javascript no es posible y no puedo modificar el archivo – user253104