Observer demo the latest section not showing

[Steve Lu]

Animated Continuous Sections with GSAP Observer (codepen.io)

 

In this demo codepen, the lastest section with class "fifth" not showing.

Anyone know how to fix it? 

 

And the Observer type, is it possible dynamic detect if the device support or not?

type: "wheel,touch,pointer",

Like desktop change to "wheel" only, and "touch,point" for mobile. 

See the Pen XWzRraJ by GreenSock (@GreenSock) on CodePen

[mvaneijgen]

Hi @Steve Lu welcome to the forum! 

 

Great catch! I've removed the -1 from the wrap variable and that makes it work. Hope it helps and happy tweening! 

 

See the Pen JjavXPe?editors=0010 by mvaneijgen (@mvaneijgen) on CodePen

 

@Rodrigo is that something you can edit? 

[Cassie]

Adjusted it!

 

Quote

And the Observer type, is it possible dynamic detect if the device support or not?

In terms of this, if the device doesn't support wheel events observer won't throw any errors or anything, this is handled internally, it's like saying 'listen to these if they exist'

[GreenSock]

20 hours ago, Steve Lu said:

And the Observer type, is it possible dynamic detect if the device support or not?

type: "wheel,touch,pointer",

Like desktop change to "wheel" only, and "touch,point" for mobile. 

Yeah, like Cassie said that probably isn't necessary, but just to point it out you can do this if you want: 

type: Observer.isTouch ? "touch,pointer" : "wheel",

👍