Eriberto

I have already explained what I want to do with Observer.

How can I use Observer to get this?

What I want to do is that when I scroll a div it gets smaller and when it finishes getting smaller, I move to the next slide. Here I have almost achieved it https://barracuda.pixelarte.com/scroll/, but it doesn't work well to move to the next slide. HTML <div id="fullpage-scroll"> <div class="section active" id="block-1"> <div class="scrollMe"></div> <div class="iWillExpand"></div> </div> <div class="section" style="background-color:red;"></div> <div class="section" style="background-color:blue;"></div> </div> CSS #block-1 .fp-tableCell { width: 100%; overflow-y: scroll; display: block; } .scrollMe { height: 300vh; width: 100%; } .iWillExpand { position: absolute; width: 100%; height: 100vh; top: 0; left: 0; background-color: aqua; transform: scale(1); z-index: -1; } Javascript var myFullpage = new fullpage('#fullpage-scroll', { lazyLoad: true, normalScrollElements: '#block-1 .fp-tableCell' }); var container = document.querySelector('#block-1 .fp-tableCell'); var containerHeight = container.scrollHeight; var iWillExpand = document.querySelector('.iWillExpand'); container.onscroll = function (e) { iWillExpand.style.transform = 'scale(' + (1 - 0.5 * container.scrollTop / (containerHeight - 300)) + ')'; };

Resize a element with scroll

How can I implement this functionality with Observer?

Hello, Here is an example: I would like to do something like this but that the pass between sections is like here: https://alvarotrigo.com/fullPage/examples/videoBackground.html There are also two problems: 1. the video pauses when I scroll and when I go back to the top it doesn't start again. 2. when I scroll down and click somewhere, it suddenly goes up. Thank you very much. Best regards

Hello, Thank you for your input. I wanted to know if it is possible to make the effect work without autoScrolling: false. Thanks