Content jumps down

[timoanzalone]

First of all, this is an easy to use and great plugin for achieving parallax effects. Kudos to you! I'm still having an issue that resembles issue #50. When scrolling, the content at the top of the page jumps down. I've updated the plugin with the latest js but the problem is still there.

[smessink]

Also from my side: Great Plugin!
But I think the issue #50 isn´t fixed with the latest version 1.4.5.
So when I start scrolling - only at the beginning - all elements that are using paroller jump down or up. After the initial scrolling all went fine and smooth.

[timoanzalone]

I also tried applying the suggested css fixes, however they do not work. The plugin overrides them with "transform: unset;".

[tgomilar]

@timoanzalone of course it overrides it since paroller.js is adding inline CSS and your code is obviously not. Based on its priority level, the inline style is higher, so it will overwrite external and internal styles, to avoid this you must add !important rule to your CSS like this .my-element {transform: unset !important;}

@timoanzalone @smessink
Content jumps down - Any concrete (Codepen) example?

[timoanzalone]

@tgomilar adding the !important rule to the CSS overrides the plugin's inline CSS, nullifying the parallax effect.

I'll setup a Codepen example soon.

[tgomilar]

@timoanzalone @smessink Fixed.
Please download a new released version 1.4.6.
You can see changes in this Codepen.

[smessink]

Hey @tgomilar: First, thank you for the fast reply.

Maybe you misunderstood the issue.
So in your codepen example it isn´t fixed for me. :(

I will try to explain it:
When you start scrolling the h1 jumps from transform: translate(0px, 0px); to transform: translate(0px, -32px);
After that it works fine and with "every scroll" the movement goes smooth from -32px to -31px to -30px and so on....

I hope, I could explain the issue?

[tgomilar]

@smessink sorry but I don't see any jumping. Could you provide video?

[timoanzalone]

@tgomilar @smessink I'm still having the same issue as well.

[smessink]

Maybe "jump" is not the right word... it is just the thing that in your example on Codepen the initial value for the h1 is not transform: translate(0px, -32px);, but transform: translate(0px, 0px); Thats why the H1 moves "on the first scroll action" -32px up and not 1px one by one.

I dont know how more concretly I can describe it :)

[smessink]

@tgomilar @timoanzalone

I´ve uploaded a video where you can see the - in this example - "little" jump at the beginning of scrolling.

Jan-29-2019 17-02-34.mp4.zip

[Mohitgold]

Yes I have same problem.

[philipgunther]

#61