Связывание

Атрибут target элемента SVG <a> не работает в Mozilla Firefox 1.5. Когда документы SVG встраиваются в родительский HTML-документ с помощью тега:

page1.html:

<html lang="en">
  <body>
    <p>This is a SVG button:</p>
    <object
      width="100"
      height="50"
      type="image/svg+xml"
      data="button.svg"></object>
  </body>
</html>

button.svg:

<?xml version="1.1" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg">
  <a href="page2.html" target="_top">
    <g>
      <!-- button graphical elements here -->
    </g>
  </a>
</svg>

Согласно спецификации, при нажатии на графическую кнопку браузер должен перейти к HTML-документу page2.html. Однако target не работает с реализацией элемента SVG <a> в Firefox 1.5. (Эта проблема будет исправлена в Firefox 2.0.)

В любом случае, в SVG от Mozilla результатом будет загрузка page2.html во фрейм, где находилась кнопка SVG (то есть page2.html будет встроен во фрейм размером 100x50 пикселей внутри page1.html).

Чтобы обойти эту проблему, потребуется немного некрасивых ухищрений с JavaScript:

button.svg:

<?xml version="1.1" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg">
  <g onclick="top.document.href='page2.html'" cursor="pointer">
    <!-- button graphical elements here -->
  </g>
</svg>

Пример

Пример работы этого решения см. на сайте www.codedread.com.