javascript — jQuery или CSS затухают текст In & Out в зависимости от прокрутки в div PARENT

У меня есть 3 блока, которые на 100% высотой КАЖДОГО …

это код

<div class="block12"><span>VRTUALL</span></div>
<div class="block12"><span>VR FOR ALL</span></div>
<div class="block12"><span>Virtual Reality for All</span></div>

Он работает нормально, но без каких-либо эффектов, я пытаюсь заставить (при прокрутке) Span исчезать, когда, например, первый почти выходит из области просмотра, и исчезать следующий, когда он появился в окне просмотра и т.д .. вот пример (http://www.magicleap.com/#/home) просто прокрутите вниз на этом сайте, и вы увидите, как текст исчезает и исчезает …

Вот мой сайт, где я пытаюсь добиться этого (http://www.vrtuall.com)

Пожалуйста, кто-нибудь может мне помочь с этим, я не очень хорош во всем этом, я пробовал ВСЕ возможные коды, которые я нашел здесь и в сети, но ни один не работал ..