html-css
html-css copied to clipboard
gustavoguanabara
Problemas ao acessar o desafio 12 via celular (iOS)
Boa noite a todos,
realizei o desafio 12 e consegui por no ar pelo github pages, entretanto quando tento realizar o acesso via celular o efeito paralax não funciona, alguém tem alguma solução para esse problema?
obs.: Meu celular e um Iphone 8.
att. Alexsander Leal
Boa noite, aqui no meu celular sua página do Cordel funcionou bem incluindo o efeito parallax.
Boa noite @Sidney-Scholze, tem certeza? O seu aparelho celular roda com iOS ou Android? Pois no meu aqui, como citei é iOS ainda não funciona, eu até testei em outros (todos iOS) e não funcionaram :-( .
Sim certeza, meu aparelho roda Android não posso testar com iOS. É só o efeito parallax que não funciona? ou a página não carrega? No seu pc está ok?
Então @Sidney-Scholze, a página funciona certinha, com todas as informações e tudo, porém as imagens não tem o efeito parallax, sendo a primeira imagem ficando embasada e a segunda esta muito grande e aparece pouco como se "cover" no css não tivesse sido aplicado
Esse mesmo projeto do professor funciona? Eu não tenho como testar em um iOS mas pode ser alguma incompatibilidade do css com o navegador.
Bom dia @Sidney-Scholze pelo que verifiquei e testei, tudo indica que pode ser um problema de incompatibilidade com iOS, pois eu baixei o google Chrome e testei e fico da mesma forma que no safari, depois eu consegui testar num celular com android e o efeito parallax funcionou perfeitamente como vc tinha citado anteriormente, vou continuar pesquisando pra ver se acho algo que possa sanar essa incompatibilidade e volto aqui pra postar ou caso algum colega que já conseguiu resolver esse problema poderá dividir conosco essa solução.
Sim seria muito legal se alguém aqui pudesse compartilhar o resultado em iOS e Android. Existem muitos métodos que podem ser adicionados no css para contornar esses problemas , mas isso na pratica quase duplica todo o css eu só não entendo o por que uma empresa tão grande não faz nada pra resolver um simples problema.
Também estou passando pelo mesmo problema. O site funciona direitinho, mas o parallax quebra no IOS. Dei uma pesquisada e, pelo o que vi, não é um problema do código em si, mas sim de uma limitação que alguns navegadores de smartphones possuem. Pelo visto, essa limitação existe para prevenir que os sites fiquem muito pesados em certos celulares (mas, aparentemente, existem outros métodos para contornar esse problema, usando o JavaScript). Tirei essa informação desse site gringo: [https://forum.blocsapp.com/t/problems-with-parallax-effect/10458]
Bom dia @Sidney-Scholze pelo que verifiquei e testei, tudo indica que pode ser um problema de incompatibilidade com iOS, pois eu baixei o google Chrome e testei e fico da mesma forma que no safari, depois eu consegui testar num celular com android e o efeito parallax funcionou perfeitamente como vc tinha citado anteriormente, vou continuar pesquisando pra ver se acho algo que possa sanar essa incompatibilidade e volto aqui pra postar ou caso algum colega que já conseguiu resolver esse problema poderá dividir conosco essa solução.
O próprio Guanabara disse certa vez no curso que a base do Chrome no IOS é o Safari, não Chromium como é comumente. Acho que seja o mesmo para todos os outros navegadores no IOS, até porque isso parece ser algo característico da Apple ao meu ver.
No Mozilla Developer é dito o Safari ter compatibilidade com a propriedade mas não com o valor fixed, no qual diz ser parcial. Recomendo que deem uma olhada.
Mano, o melhor jeito possível para isso é com JavaScript creio eu. Li um artigo certa vez mostrando como adquirir o efeito — não testei, mas dá pra conferir o resultado. Tem um comentário interessante lá também. @Leal86
Espero poder ter ajudado. Bons estudos.
O meu está funcionando normal, tanto no PC como no celular
Em sáb, 26 de mar de 2022 16:42, Leal86 @.***> escreveu:
Boa noite a todos,
realizei o desafio 12 e consegui por no ar pelo github pages, entretanto quando tento realizar o acesso via celular o efeito paralax não funciona, alguém tem alguma solução para esse problema?
att. Alexsander Leal
— Reply to this email directly, view it on GitHub https://github.com/gustavoguanabara/html-css/issues/193, or unsubscribe https://github.com/notifications/unsubscribe-auth/AYJOK7QMYCHKXFEAQ2F42PTVB5SDRANCNFSM5RXR4FNQ . You are receiving this because you are subscribed to this thread.Message ID: @.***>
Olá, tive o mesmo problema quando realizei meu projeto, pesquisei um pouco sobre o assunto e achei a mesma resposta que o @GabrielChiarelli , um absurdo os aparelhos da Apple não serem compatíveis com todos estilos do CSS até hoje. Meu celular já esta na versão 17 do iOS, mas não é compatível.
Mas, pesquisando sobre algum método diferente para ter o mesmo efeito, vi que dava para fazer o parallax usando "div's" para colocar as imagens e utilizar nessas div's o "position: sticky", e utilizei uma "div" com "position: absolute" onde coloquei todo o conteúdo, assim ela fica sobre as outras div's com as imagens.
Abaixo deixei os links para quem quiser dar uma olhada.
Minha pagina Cordel Moderno Meu repositório github
Acredito que ficou bom, se alguém tiver algo a acrescentar, seria um prazer.
Bons estudos a todos, valeu.
