Canvas Support

Parallax behaviour different between webbrowsers

6 replies · opened Mar 18, 2021

FFameMar 18, 2021

Hello,
in my current state of website design I am using a parallax image as some soft of header-banner.
I am having difficulties configuring the parallax effect properly for a neat scrolling effect on each web browser.
The configuration I chose has a satisfying effect in the newest Firefox (stable) but it is totally different in Microsoft Edge and Google Chrome Browser.

I added a live URL to an example.

Please notice how the image is sliding from top to bottom when moving the website down on Firefox.
On Chrome/Edge this effect is almost not existent also the start position differs noticeable.

Do you have any advice to get a similar scroll effect while maintaining the identical behavior between the web browsers?

The image shows Firefox at the left and Edge at the right.
In the top part with the scrollbar at the beginning
In the bottom part with the scrollbar further down.

SSemicolon WebSTAFFMar 20, 2021

Hello,

Thanks for reporting this issue! We acknowledge this behavior and still working on determining what is exactly causing this. Unfortunately, it appears that this works differently on different browsers as Chrome/Safari display same while Firefox displays a bit differently. Also, this appears to be a issue with the Plugin setting the Image Background Positions differently on different browsers.

We Apologize for the Inconveniences caused. We are still working on this and trying to come up with the best possible solution available for this issue. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

SSemicolon WebSTAFFMar 20, 2021

Hello,

We tried this code and it work perfectly fine across browsers:
[ch_pre][/ch_pre]

We are still trying to find out why it doesn't work correctly with the other code. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

FFameMar 20, 2021

Thanks for looking further into this.
Noticing the snippet you provided do indeed have identical behavior between the browsers.
But it has 2 downsides:

  • The previous scroll behavior (preferred) in firefox is gone.
  • Depending on web browser window size the image moves out of the border (wasn't the case in firefox before)
SSemicolon WebSTAFFMar 23, 2021

Hello,

Thanks for your Patience!

We are still looking and working on resolving this. We will get back to you with a solution soon.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

FFameMay 2, 2021

Hello, is there any update on this issue yet?

SSemicolon WebSTAFFMay 3, 2021

Hello,

Thanks for your Patience and Apologies for the Delays.

We have checked this over and over again and currently this is the only solution available for this issue. Unfortunately, this is a Plugin Limitation or also might well be a bug and we working on our own Parallax Solution for more consistent results. Currently we are not sure when this update will be released as we still need further tests to make this available for production. Thanks again for Understanding and your Valuable Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard