Comments (4)
Hi Aston and thank you for your message.
The reason for this phenomenon I believe to be the following:
It stop's working at the PIN IT section, when using the scrollbar.
In the current version of superscrollorama we introduced a new variable "pushFollowers" for pins, that defaults to true, reflecting the previous behaviour.
When superscrollorama reaches a point where something needs to be pinned a spacer is expanded to "push down" following elements. This results in a change of the scale of the scrollbar.
You can observe this by looking at the scrollbar's size, when scrolling down using the mouswheel.
This change in scale, when reaching the pin-point results in a jump, as you are dragging the scrollbar.
I already talked with John about a solution to this. To my mind the solution would be that the spacer should be expanded right from the beginning for pinned elements that "push" followers.
The reason we didn't implement this is that is rather complicated.
First of all the spacer size changes, depending wether it should include the pinned element's size (when pinned) or not (when pinned). Secondly the spacer's position within the dom must change. (after the pin element, when before pinning, before the pin element after pinning.) And this in turn raises another issue as the spacer is also used to "remember" the original position of the pinned element.
You see we are aware of this issue and are considering how to resolve it. A solution could be to add another spacer after the pinned element, but we'd like to avoid adding elements to the dom if it's possible.
For now you can avoid this "bug" by setting "pushFollowers" to false and adding a large enough container after the pinned element. This way the body size doesn't change and you avoid the bug alltogether.
regards,
Jan
from superscrollorama.
I noticed this also, and for my project we were using parallax layers ( another plugin, not superscrollorama parallax )
because the layers are fixed position, my pinned element was free to flow behind the next layer as it is being parallax'd over the pin. This made for a very nice effect, without increased scroll bar sizes.
from superscrollorama.
Hi Jan thanks for feedback, great help!
from superscrollorama.
Good news, everyone! :)
A solution might be near! Check it out: #94
regards,
Jan
from superscrollorama.
Related Issues (20)
- Trouble with Mobile Superscrollerama HOT 2
- How to disable Superscrollorama in mobile devices? HOT 1
- Mac chrome lag HOT 2
- Make a tween.js version? HOT 1
- CSS problem HOT 4
- Scroll not working on PC mouse wheel HOT 1
- Superscrollorama and screen size/media queries HOT 1
- Superscrollorama autostart from top HOT 1
- Superscrollarama does not reverse start values HOT 4
- How do I scroll two time for pinned element before the window go to next pinned element HOT 1
- Adding delay to tween HOT 4
- Query: flashing mid animation HOT 1
- Skip pinned element HOT 4
- Is there a seek functionality ? HOT 1
- Uncaught TypeError: $.superscrollorama is not a function HOT 2
- Scrolling performance improvements via layerization HOT 4
- add package.json HOT 3
- Espaçamento no topo
- help scroll
- My SuperScroll Orama not working in firefox while working in chrome
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from superscrollorama.