Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not work smoothly on desktop as well as mobile. #14

Open
skwebs opened this issue Jun 25, 2019 · 3 comments
Open

Not work smoothly on desktop as well as mobile. #14

skwebs opened this issue Jun 25, 2019 · 3 comments

Comments

@skwebs
Copy link

skwebs commented Jun 25, 2019

First thank you to create incredible parallax effect on web page. I like it much and use it in my project and it is on mobile very well. But it doesn't work as well as mobile. Something got different when browser address bar hide and show during scroll. Please improve it if possible.

@marrio-h
Copy link
Owner

marrio-h commented Aug 2, 2019

Hi @skwebs,
Thank you! Cool to hear you find it useful :)

  • First, which mobile browser are you using?

  • Second, the jumpy effect with the toolbar it's a well known problem on mobile. Up to now I have been counter-battling the problem with specific code for both chrome and iOS and it works there (tested on iOS). I have been trying out Brave mobile browser and see it's a bit buggy myself.

  • The problem; calculating screen height and window height (in addition the big/small address bar) isn't always manageable to determine with javascript. E.g. on iOS, the top bar isn't included in the height at all. I solved it by adding a buffer to the height. It's not perfect but that's how the vendor made the browser, unfortunately.

Regardless I will look into it a bit more if you let me know which browser you are using.

Thanks for letting me know!

@koshlmba
Copy link

koshlmba commented Feb 4, 2020

Hi @marrio-h !
I faced a problem with parallax on mobiles and safari on desktop. Script adds top: -38px to the background image http://joxi.ru/52aVlvOtbZaE8A and I have a white space on the bottom of the screen http://joxi.ru/BA0Vo17tPwbPom Same problem on mobiles (android + chrome, iOs + safari).
Maybe its happens because you added a buffer to the height.

@jtsimoes
Copy link

jtsimoes commented Jul 5, 2020

I can confirm that it works perfectly on Chrome (both Android and iOS latest version), so that should be a bug on your website custom CSS.

And many thanks for this! It was really (and I mean, really) hard to find a parallax script that works 100% on both desktop and mobile, facing that annoying background image flickering bug when show/hide the URL bar.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants