currently I have a fixed text animation just infinitely looping over top of my fullpage wrapper. I want to have it so that my text animation only changes when I scroll from section to section. I'm also trying to have it disappear after I scroll away from section2 onto section3. I'm a little confused as to make this happen...
currently
<body>
<div class="featuredtitle">
<div class="visable">
<ul>
<li><h1>nameone</h1></li>
<li><h1>nametwo</h1></li>
<LI><h1>namethree</h1></li>
</ul>
</div>
</div>
<div id="fullpage">
<div class="section active" id="section0"></div>
<div class="section" id="section1"></div>
<div class="section" id="section2"></div>
<div class="section" id="section3"></div>
</div>
</body>
text animation: http://codepen.io/yoannhel/pen/sJpDj
sorry if im doing this wrong first time posting on here..
You have an example within the examples folder of fullPage.js. The filename is "callbacks.html".Check it out.
You can make use of fullPage.js callbacks to fire them, or even to the state classes added to the body element if you want to fire them with CSS.
Check also this example regarding the fullPage.js callbacks
In your case it seems you would like to use the
onLeavecallback.