如何创建在滚动到视图时滑入视图的元素，然后在滚动页面时再次消失？

Question

我正在寻找创建一种效果，当两个文本块滚动到视图中时，它们会从左侧和右侧滑入，然后相同的块会在它们离开视口时消失。我想，我需要改变不透明度和左/右值，但我很难做到这一点。

我遇到的问题是，即使我可以检测到我在正确的if / else部分内，或者效果无休止地触发，效果也不会触发。

通过此功能可以轻松检测页面滚动到右侧区域的时间：

$(window).on('scroll', function() {
    scrollPosition = $(this).scrollTop();
    if (scrollPosition > 500 && scrollPosition < 1000) {
        //slide into view
    } else {
        //slide out of view
    }
});

我已经能够从this previous question和this one收集一些见解，但我仍然无法找到适合我的解决方案。

有人可以帮忙吗？