Изображение заголовка с прокруткой параллакса не загружается на мобильных устройствах. Что может быть причиной этого?

avatar
Nicholas Mahler
8 августа 2021 в 17:07
38
0
0

На моем Android и компьютере изображения загружаются нормально, но на Iphone они не загружаются, и фон становится черным.

Вот CSS и HTML

.parallax {
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("duoAngelFront.jpg");
    background-size: cover;
    min-height: 100vh;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
<div class="parallax">
    <h1 class="text-center" style="text-shadow: 1px 1px black;color: white;padding-top:250px;font-size:3.5rem;font-family:" Montserrat"";>Zero Mile, Upgraded and Stock Boards For Sale Now!</h1>
    <p class="text-center" style="text-shadow: 1px 1px black;color: white;padding-top:50px;font-size:1.5rem;font-family:" Montserrat"";>We have a wide variety of boards in stock now that are ready to go! You can choose from our selection of already upgraded boards, a stock board or choose a stock board and the upgrades <em>you</em> want! See below for details and pictures.</p>
</div>

Вот страница: https://www.onewheelnwa.com/rental.html

Источник
michaPau
8 августа 2021 в 17:27
0

Вы используете Safari на iPhone? background-attachment: fixed не похоже, не поддерживается для Safari на os. Этот ТАК вопрос может быть связан с.

Nicholas Mahler
8 августа 2021 в 20:25
0

Большое спасибо за ваш ответ. Я изменил фоновое вложение, чтобы прокручивать медиа-запрос, ориентированный на мобильные устройства, поэтому параллакс работает на рабочем столе, но затем остается фиксированным на мобильных устройствах. Простое исправление, я понятия не имел, что оно не поддерживается в Safari OS.

Ответы (0)