My goal is to implement behaviour as it is shown in following gif but with one gesture:
- Touch "Birmingham"
- Move finger up what should cause "Temperature in my city" being hidden
- Still moving finger up inner scroll should start scrolling
- Change direction down what should cause inner scroll direction change
- When inner scroll gets the very top outer scroll starts scrolling making "Temperature in my city" visible
- Release finger
Question:
Is it possible to achieve such behaviour with css scroll chaining. I try to use overscroll-behavior css property but it seems it gives far less options to what I need
For sure everything can be implement just with one scroll but I plan to make css transitions for "Temperature in my city" element where the transitions will be dependent on outer scroll position but independent on inner scroll.
Thx :-)
