0

Использую svg спрайт вида

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:i="&ns_ai;" xmlns:graph="&ns_graphs;">
<defs>
    <style>
        .view {
        display: none;
        }
        .view:target {
        display: inline;
        }
    </style>
    <symbol id="svg1">
        ........
    </symbol>
    <symbol id="svg2">
        ........
    </symbol>
</defs>
    <g id="svg1_view" class="view">
        <use xlink:href="#svg1" />
    </g>
    <g id="svg2_view" class="view">
        <use xlink:href="#svg2" />
    </g>
</svg>

Вызываю его через src='sprite.svg#svg1'

Во всех браузерах, кроме Safari иконки отображаются отлично. В Safari иконки не отображаются (не в тэге 'img', не в background-image). Если открыть спрайт в отдельной вкладке, то там иконка отображается.

Artem_Astakhov
  • 3
  • ага, меня это тоже напрягло, пришлось разбивать. http://caniuse.com/#feat=svg-fragment – Artem Gorlachev May 25 '17 at 12:50
  • @ArtemGorlachev Но ведь Safari понимает этот синтаксис и если в строку вписать /path/to/sprite.svg#svgpart то он отобразит нужную иконку – Artem_Astakhov May 25 '17 at 13:08
  • @Artem_Astakhov попробуйте использовать рекомендации из ответа - https://ru.stackoverflow.com/questions/665755/%D0%9A%D0%B0%D0%BA-%D0%BF%D0%BE%D0%B4%D0%BA%D0%BB%D1%8E%D1%87%D0%B8%D1%82%D1%8C-svg-%D1%81%D0%BF%D1%80%D0%B0%D0%B9%D1%82-%D0%B2-%D1%84%D0%B0%D0%B9%D0%BB-%D0%B2-html-%D0%B8-css/666763?noredirect=1#comment969148_666763 – Alexandr_TT May 27 '17 at 19:14

0 Answers0