Jump to content
Search Community

Scroll Trigger Split Text Line Reveal

james12345 test
Moderator Tag

Go to solution Solved by akapowl,

Recommended Posts

Hi,

I have a scroll trigger that triggers a split text section by line, triggered by the split text section. The demo attached is actually working and roughly what I want, however I was wondering if this could be done better or more efficiently using batch, or some other way? 

I primarily ask as I'm having some trouble using ajax navigation, after killing off the scrolltrigger using the id, and then reinitialising it while wrapping it in an if function with the document.querySelector(), I'm still getting GSAP target  not found. This has previously worked without using split text and animating by line, so thought I'd make sure batch or another way wasn't more efficient first.

Cheers 

See the Pen ZEaELdj by jamesstudiothis (@jamesstudiothis) on CodePen

Link to comment
Share on other sites

  • Solution

I think the problem might be, that you are not re-assigning your variables to the correct elements in your setupSplits() function, but only once on page-load, so the variables are still targetting the old elements when you call that function again.

 

You might also not want to only wrap the .split-line only on $(document).ready.

 

Here is an example killing the old ScrollTriggers, removing the elements from the body and re-setting things to the original structure (quick and dirty) via innerHTML before calling the setupSplits() function again after a second waited, and it looks to be working.

 

See the Pen OJONbzb by akapowl (@akapowl) on CodePen

  • Like 4
Link to comment
Share on other sites

Hi again all, after a bit more playing it appears the 'GSAP target not found' only shows on <p> elements, but also only after navigating back to the original first loaded page. I imagine again this is an ajax issue primarily but I just thought it was strange to only happen on paragraph elements, heading tags, divs, spans etc seem to be fine, so just wanted to check it wasn't a split text thing, before I continued deeper?
Cheers! 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...