Olá, Ana.
Tudo bem?
Uma sugestão: Você pode usar JavaScript para criar o efeito Parallax de forma que funcione em todos os dispositivos, incluindo iOS. Aqui está um exemplo simples de como fazer isso:
1. Primeiro, adicione a biblioteca jQuery ao seu projeto (se ainda não estiver usando):
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
2. Em seguida, adicione o seguinte código JavaScript para criar o efeito Parallax:
<script>
$(window).scroll(function() {
var scrollTop = $(window).scrollTop();
$('.parallax').css('background-position', 'center ' + (scrollTop * 0.5) + 'px');
});
</script>
3. No seu CSS, defina a classe .parallax
para a imagem de fundo:
.parallax {
background-image: url('sua-imagem.jpg');
background-size: cover;
background-attachment: scroll; /* Isso evita o problema no iOS */
height: 500px; /* Ajuste conforme necessário */
}
4. E finalmente, no seu HTML, aplique a classe .parallax
ao elemento desejado:
<div class="parallax"></div>
Com isso, você deve conseguir um efeito Parallax que funcione tanto em dispositivos iOS quanto em outros dispositivos.
Lembre-se que é apenas uma sugestão, mas é bem utilizado, qualquer coisa tenta dar uma pesquisada sobre efeito paralax com JavaScript.
Espero ter ajudado e bons estudos!