Parallax effect not working correctly in Firefox or Internet Explorer

Hi, following the instructions of Nelson, I´m going to post my actual problem with some browsers:

I have done a website with webflow (www.janadasilva.com) and the parallax effect that I did in the home page is no displaying correctly in Firefox and Explorer (it displays correct in Chrome, Safari and Ipad). How can I fix the parallax effect on Firefox and Explorer without to affect the other browsers?

Thanks so much for your help.
Regards,
Jana Da Silva

Hi @janads

Can you please update your post with some more information so we can help you faster? Things like screenshots and your environment info really speed things up.

Posting guidelines can be found here: Posting Guidelines for the Design Help Category - General - Forum | Webflow

Thanks in advance! :slight_smile:

Hi @janads, thanks for the post. I did a quick test on www.janadasilva.com on IE and Firefox for mac, and it is working for me :slight_smile: are you on mac or pc ? what version of operating system and what version of browser are you using?

I did not see any code errors on the page either in the console. Cheers, Dave :slight_smile:

Hi! Thanks so much for all replays, so sorry PixelGeek, I didn’t see the email that noticed your replay. And thanks so much cyberdave to check my browser issue. I have an OX 10.8 and from this I can see the parallax effect correct at Safari an Chrome, but Firefox display wrong (attached screener). And for Explorer I’m usisng a simulator and this one display the same issue than in Firefox.

I attache as well how it looks in chrome (the correct display of the parallax effect)
Thanks!

Hi @janads, sorry for the long delay in reply, Could you share the site read-only link: Share a read-only link | Webflow University, I am happy to take a look and look if I can find out what is happening.

Cheers,
Dave

Thanks so much! this is the link: https://preview.webflow.com/preview/janadasilva?preview=4fc7c53138eb841294b1705ccc7b3f55

Thanks :smile:

Hi @janads, thanks I am taking a look :slight_smile:

1 Like

Hi @cyberdave, any news on this?
Thanks
Jana

Hi @janads, thanks for the followup. I have been looking into this, but I do not have a solution for you yet. It is possible the container that holds the scene might be causing an issue in FF and IE.

Could you try to make a duplicate of the site, and then instead of putting the parallax scene in a container, could you use a div instead and do the following:

a. Set the width to 75%
b. Set the div to left and right margin set to auto

Here is the actual page for this plugin, I think it would be a good idea to post about this trouble there as well, since the plugin is supported from that page:

This might be a related issue: Parallax scaling only first layer in Firefox/IE? · Issue #84 · wagerfield/parallax · GitHub

I am continuing to investigate, but as of right now, I do not have a solution for this.

Cheers,
Dave

Hi @janads, a couple more things for you to try with a duplicate copy of the original site:

  1. Give the section containing the scene, a height of 100%

  1. Give the container a height of 100% and position relative:

  1. Give the Scene class a height and width of 100% and position set to absolute.

I do not know if that will work, as it need to be published…

Thanks so much @cyberdave , I’ll follow your instructions and I’ll let you know the result.

Thanks and regards,
Jana Da Silva