SVG фоновое изображение не появляется на iPad

У меня очень странная проблема с фоном на сайте. Я использую несколько фоновых изображений; есть 4 фотографии, а затем SVG с угловыми фигурами, которые идут поверх изображений и кадрируют их. Это CSS для фона телаSVG фоновое изображение не появляется на iPad

body { 
    background-color: #bbe2de; 
    background-image: url('/img/mobile-bg-exorcised.svg'); 
    background-position: top center; 
    background-repeat: no-repeat; 

    color: #2a2a2a; 

    font-family: "ff-din-web"; 
    font-size: 16px; 
    line-height: 1.4em; 
} 
@media screen and (min-width: 600px) { 
    body { 
     background: 
      url('/img/desktop-bg.svg') top left, 
      url('/img/bg-photo-4.jpg') 849px 4460px, 
      url('/img/bg-photo-3.jpg') 0 3948px, 
      url('/img/bg-photo-2.jpg') 617px 980px, 
      url('/img/bg-photo-1.jpg') 0 186px; 
     background-repeat: no-repeat; 
    } 
}

Он отображает должным образом на все настольные браузеры, но на IPad SVG просто не отображается на всех. Остальные изображения хорошо видны. Я использую SVG в качестве фоновых изображений в другом месте на сайте, и они отображаются хорошо, поэтому я не думаю, что это проблема с сервером, как тип MIME.

Вот ссылка на сайт, жить: http://johnkatimaris.thesmackpack.com/

А вот файл SVG в вопрос в случае, если вы думаете, что может быть что-то не так с ним конкретно: http://d.pr/f/2vp4

Любые идеи, почему это не работает?

источник

2013-09-24 Ryan Giglio

Это странно. Изображение загружается отлично на iPad, [его SVG действителен] (http://validator.w3.org/check?uri=http%3A%2F%2Fjohnkatimaris.thesmackpack.com%2Fimg%2Fdesktop-bg. svg & charset =% 28detect + автоматически% 29 & doctype = Inline & group = 0), и MIME установлен правильно. Попробуйте создать страницу с помощью только какого-то текста, и только этот фон и работайте оттуда. В качестве альтернативы подключите iPad к Safari и используйте [его веб-инспектор] (http://webdesign.tutsplus.com/tutorials/workflow-tutorials/quick-tip-using-web-inspector-to-debug-mobile-safari/) –

Я снова столкнулся с этой проблемой на другом сайте с другим SVG-файлом и имел ту же проблему. Это СМОТРЕТЬ, как будто есть какой-то недокументированный предел тому, как высокий iPad будет отображать SVG. Это на самом деле не имеет смысла, и я действительно не думаю, что это на самом деле, но это единственное, что я могу придумать, так как сокращение изображения исправляет его сразу в обоих случаях.

источник

2013-11-25 15:51:10

Положив высоту около 5400 пикселей, мой svg больше не будет отображаться, как вы сказали. Кажется, что он имеет размер фона после того, как фоновая позиция исправляет его. http://stackoverflow.com/questions/18999660/background-image-not-showing-on-ipad-and-iphone – Amalgovinus

SVG фоновое изображение не появляется на iPad

ответ

Смежные вопросы