There is a page on it on the screen scroll, which means that the default scroll is disabled. Therefore, the window.scrollTop () function, which could be used to add / remove classes when scrolling to a specific place on the page, does not work. The section is now at any height of the screen is drawn to 100%, respectively, there is no exact height of each section. How can I add and remove classes when scrolling to a specific section? If someone knows, please write a sample code
- It would be nice to know exactly how the standard scroll is blocked. Because that's where the solution to your problem lies. - alexoander
- @alexoander Thank you, I have already found a solution in the functionality of the plugin itself - Oleg
- share your answer with us! Write the answer and mark it as an answer. I just wonder too =) - alexoander
|
3 answers
$('#fullpage').fullpage({ anchors: ['firstPage', 'secondPage', 'thirdPage', 'fourthPage', 'lastPage'], afterLoad: function(anchorLink, index){ var loadedSection = $(this); //using index if(index == 3){ alert("Section 3 ended loading"); } //using anchorLink if(anchorLink == 'secondSlide'){ alert("Section 2 ended loading"); } } });
The plugin was used fullpage.js, with this code you can register any changes when flipping through the slides
|
You can create the scrollTop
variable and add / decrease the value when scrolling. And the height of each block is window.innerHeight
.
- Scrolling as such, no. Just when scrolling the wheel, a transformation occurs vertically. It is impossible to calculate the scrollTop () distance, so the answer is generally by. - Oleg
- Well, there is a function that is responsible for the transformation, well, you add a variable to it, and when you scroll the wheel up or down, you add or subtract a value accordingly. - G.Denis
|
Plugin fullpage.js was used; In the afterload or onleave event, you can hammer conditions in which to write as many js of code as you like. The best option is afterload, although a matter of taste. In the documentation, by the way, all this is written with examples, so do not be lazy to read the readme)
|