Jump to content
Search Community

Disable scrolltrigger after orientation change

dr.Pxl test
Moderator Tag

Recommended Posts

Good evening,

 

I have a little trouble with a Scroltrigger topic. 

I basically want to disable a scrolltrigger and all connected tweens when a user rotates it's device.  I tried to change a variable so the if-loop would not be entered any more. Unfortionally this does not work. Maybe someone has a idea..

 

Thank you in advance.

See the Pen mdMqyoJ?editors=1111 by dr_pxl (@dr_pxl) on CodePen

Link to comment
Share on other sites

Hey @Cassie,


thank you for your help!

Your answer is a good start for me, but I need a bit more input at this point - sorry for that. 

The thing is: I want to deliver the on scroll animation for either - landscape or portrait - but if the orientation changes I want to switch into a static mode. Everything works finde, but the scrolltrigger is still enabled. I thougt of maybe a variable that handles that stuff. Something like:
 

    ScrollTrigger.matchMedia({
`(orientation: ${originalOrientation}`: function() {
// do stuff
}, 
`orientation: ${changedOrientation}`:function () {
// do nothing or either kill
},

})

 

But scrolltrigger does only acceppt strings in typical "". 

Maybe you have some idea :).

Bye!

 
Link to comment
Share on other sites

Sure thing, no worries.

So if I'm understanding correctly you want to kill all the scrollTriggers when you change orientation? You could do this separately from scrolltrigger.matchMedia

 

window.addEventListener("orientationchange", (e) =>{
  ScrollTrigger.getAll().forEach(st => st.kill())
});

 

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...