在滚动中的div内淡入和淡出内容

Question

I need some content to appear (fade in) and disappear (fade out) inside a div while scrolling down with the BROWSER SCROLLBAR (not a scrollbar inside the div), making it reverse when scrolling up ( in a loop).

This link shows a video about what I exactly mean: https://youtu.be/6pSIGNe1yWg

It looks pretty simple, but all the examples I have seen on the Internet are related to revealing/hiding content at the top/bottom of the screen. Others, like news tickers, for example, depend on scrollbars inside the div or buttons to slide up/down the content ( http://logicbox.net/jquery/simplyscroll/vertical.html )

So, how to reveal/hide content inside a div in the middle of the screen/page while scrolling down/up (reverse) with the BROWSER SCROLLBAR??

Answer 1

What you are trying to do is called "scroll spying" -- essentially firing events based on where a user has scrolled to on a page. If you search for "jQuery scroll spy plugin" you'll find many options to accomplish it. Here's one that looks promising: https://github.com/sxalexander/jquery-scrollspy

Good luck!