Trouble with Parallax Design

There was a topic about this earlier which started with a video tutorial explaining. I followed the instructions but I also saw that the video, showed a different (maybe older interface) of webflow.

How to make parallax elements in Webflow - Webflow Tips - Forum | Webflow "

here is the link to my site, what am I doing wrong?

https://preview.webflow.com/preview/dtsgold?preview=56505bcc2e82db1c2f8f9cdcfa2bf6e8

Hi @Aimanisms, thanks for the post. I think the first thing to check, is what kind of errors may show on the published page in the browser. Could you also publish your site and then let us know, we can look at that, and it will be easier to track it down :slight_smile: Cheers, Dave

the published site is dutchmansgoldthegame.com

Hi thanks @Aimanisms, it looks like on that site, there is some javascript errors happening, that prevent other scripts from executing normally. See my screenshot of the console in chrome. I would check those errors first:

Check the link to the script you are trying to load from Google drive, and check the code that is giving an undefined error… it could be related to the Google drive error. I hope that helps. Cheers, Dave

yeah, the tutorial said I had to upload a link to a public cloud application and use that link to load the script from.

changed the link to dropbox, the same app, the tutorial user used. Still doesn’t work @cyberdave

Hi @Aimanisms, that dropbox link does not seem to be linked to the download page for that file. Try this link below, which is the same as the link you used, but uses the direct download dl domain, instead of www:

https://dl.dropboxusercontent.com/s/rwo7z97zio30cdz/jquery.parallax.js?dl=0

Replace the old dropbox link with one above, save changes and then republish. Let me know after you fix that, and I can take another look :slight_smile: Cheers, Dave

Just did :smiley: and published

Hi @Aimanisms, thanks for the update. Upon checking the site, the problem with the js linked from google is solved. There is an error though now shown with the Google Analytics snippet that must be solved.

See my screenshot of the console error.

I would check that the snippet has the needed code correctly set. It might be having a problem with the USERID part of the code. I would check next with Google documentation on how that Google Code should be. If you can describe what you are trying to setup with Google, we can help to advise :smile:

Yes, it is the user id part of the code, I don’t know where to put in the custom code tab.

And I still don’t have the parallax effect. After a full day of working on it, what am I missing?

Hi @Aimanisms, well the parallax will not work until after you get all the other errors solved. What you might wna to do, is to remove the GA code completely for now, and lets tackle one thing at a time. Can you remove completely that Google Analytics code, then let me know, and I can take a look at the site again. Cheers, Dave

removed and republished the site. @cyberdave

@cyberdave 1 day later, what’s up dave?

Hi @Aimanisms, thanks for your patience, sorry for the delay. We handle support for custom code/design issues as we have time free from taking care of system platform issues. We do not guarantee response times, however we make our best effort to check and respond within 24-48 hours of an update. I appreciate your understanding. I can see that there is no more javascript errors, but the parallax is not working yet, so I will check this out further and come back with more info soon. Cheers, Dave

1 Like

Well, my parallax question/issue started this weekend. @cyberdave . But it’s all right, great the errors are gone, I will wait patiently.

Hi @Aimanisms, if you follow the video tutorial, you need to put in a list box with some items, however in the site I could not find these elements. I have created an example site you can clone. Go through that and watch the tutorial again and see how that is made.

https://webflow.com/website/example-parallax?s=example-parallax

You will need to update your design to add the elements referred to in the video to make it work. If you add those and then try again, if it not work, then let me know and I am happy to take a further look.

I hope this helps. Cheers, Dave :slight_smile:

Hello @Aimanisms, thanks for the PM. Based on our discussion, I have created a basic parallax example from your site, to show how it can work. You will need to adjust the content and styles etc in the different layers. Is this what you are trying to achieve?

published site: http://dtsgold-copy.webflow.com/

preview site: https://preview.webflow.com/preview/dtsgold-copy?preview=1dd421bdf07dc30bc7fa96e6b7f95c1c

I would suggest to watch the tutorial from PixelGeek again. One other issue, is that for some reason, the link to the parallax javascript in your site seems to be invalid. You can remove the Google Analytic code from the Footer, since you have that in the Head already.

Stick with continuing to learn Webflow, I know you can do it :smile: I hope this helps :slight_smile: Cheers, Dave

This topic is now unlisted. It will no longer be displayed in any topic lists. The only way to access this topic is via direct link.