- This topic has 3 replies, 2 voices, and was last updated 2 years, 5 months ago by
.
-
Posts
-
Hi all,
I’m trying to make a Parallax effect but it does’nt work in mobile.
I tried with html+css and with GPBlocks.
Any suggestions, please?
Thank you,
Best regards,
Customer Support
Hi there
are you using the background-attachment fixed property?
If so it won’t work on mobile, as its extremely processor intensive so most mobile devices disable that .Hi David,
Thanks for your quick response.
Yes, this is the code:
.container-parallax-img{
height:500px;
width:100%;
background-attachment:fixed;
background-repeat:no-repeat;
background-size:cover;
background-position:center;
background-image: url(“X.jpg”);
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
-webkit-backface-visibility:hidden;
}I see perfectly in my laptop, but it does’nt work on mobile device. Also I did it throught the GPBlocks and the result is the same: It works for laptop but not for mobile devices. I don’t know what can I do.
This:
background-attachment:fixed;which fixes the background image will not work on a mobile device.
Fixing a background image requires a lot of CPU/GPU Processing which requires a lot of battery power.
So mobile manufactures block the fixed background – simply put it will not work on mobile
- You must be logged in to reply to this topic.
