Прозрачный SVG в iOS WebKit

У WebKit была ошибка, из-за которой встроенный SVG (с помощью <embed> или <image> ) имел белый фон вместо прозрачного.

Он был исправлен, но не на iOS, где есть намного более старая версия WebKit

Есть ли какое-то хорошее обходное решение для этого? Мне отчаянно нужен прозрачный фон.

Я знаю два субоптимальных обходных решения:

  • Используйте <img> . – Я не могу этого сделать, потому что дерево DOM / XML SVG, вставленное как imgs, не может быть перемещено / обработано.

  • Маска <object> или <embed> с самим собой. Удивительно, что старый WebKit может обнаружить прозрачность, если SVG используется как маска. Однако я считаю это уродливым решением:

    <object style="-webkit-mask-image:url(image.svg);" data="image.svg" type="image/svg+xml" />

Есть ли хорошее решение?

Я нашел решение.

Я могу использовать встроенный SVG / XML. В этом случае я получаю как прозрачность, так и способность пересекать узлы SVG DOM.

Единственным недостатком является то, что я должен использовать правильную разметку XML с правильными заголовками Content-type ( text/xml как-то работает лучше всего, я не знаю почему)

Об ошибках, о которых вы говорите, хорошо известно. Если это на iOS, вам действительно нужно использовать векторную графику? Почему бы не использовать PNG с наследованием прозрачности?

  • видимые полосы прокрутки IOS с "webkit-overflow-scrolling: touch"
  • iOS 10 Webkit Воспроизведение нескольких видеороликов Inline
  • Как включить локальное хранилище в моем приложении на основе WebKit?
  • Ошибка прокрутки Webkit
  • WKWebView внутри UIScrollView: прокручивание конфликта
  • Как прокрутить палец прокрутки прокручиваемого div с помощью "webkit-overflow-scrolling: touch"
  • Почему Apple относится к этим приложениям специально?
  • как заставить текстовый файл с настраиваемым расширением открываться в myApp, а не отображаться как текст в Safari
  • Изображения iOS5 исчезают при прокрутке с помощью прокрутки webkit-overflow: touch
  • Улучшение скорости CSS3 на iPad
  • -webkit-overflow-scrolling: touch разбивает мой -webkit-scrollbar css в iOS
  • Interesting Posts
    Давайте будем гением компьютера.