liens interne en sur image .svg

Dominic de Barmon
Les bases HTML/CSS

Bonjour,

Voila je rencontre un petit problème avec mon code. J'ai inséré une image .svg en alternative à un .png avec une image map pour avoir un rendu responsive. Or une fois les liens définis dans le .svg, ils s'ouvrent quand j'ouvre le fichier seul, mais pas lorsqu'il est intégré à ma page html (j'arrive pas à le mettre en background css).
HTML


        <div>
            <img name="mainvisual" src="img/mainvisual.svg" width=100% height=auto alt="mainvisual">
        </div>```

Le .svg est très grand, mais le lien est ici:
<a
       xlink:href="http://www.w3.org/ "
       id="a4539">
      <rect
         style="fill:#a5c0ff;fill-opacity:0.29591836;stroke-width:0.26458332"
         id="rect4537"
         width="243.41666"
         height="208.64285"
         x="-0.75597572"
         y="-219.31549" />
    </a>
 Merci de votre aide!
 PS: je sens que le prochain problème sera de définir des liens qui renvoient à des balises de l'index html...

1 réponse

Dominic de Barmon
Auteur

Après quelques essais dans un fichier séparé, j'ai pu me rendre compte que l'utilisation de la fonction <object> dans le html permet de rendre valide les liens. Par contre je n'ai pas résussi à créer de lien vers les balises. Mais il se trouve que cela m'a donné de nouvelles idées! 

<section>
            <div>
                <object 
                data="img/mainvisual.svg" width="100%" height=auto type="image/svg+xml">
            </object>
        </div>
    </section>