Playing video by frames with scrolltrigger

[Sercotec]

I have tried several methods mentioned in the forum yet i could not find a proper smooth play by scroll for videos. I created one in the code pen , yet the issue is it only animates smoothly if it is safari desktop, safari mobile or even firefox mobile (checkd in macos and ios). If it is chrome or firefox desktop which uses webp version of the movie, no chance it just skips animations in the middle.

Any thoughts ?

See the Pen LYaVrbd by sercotec (@sercotec) on CodePen

[Cassie]

Hey there!

 

Scrolling through a video is tricky because it's more down to the encoding the video uses than the GSAP code. 

This is a useful ffmpeg snippet - 

 

I'd personally recommend going the image route if you only have a short video. Much easier to manage, I'm sure there are tools out there that can spit out frames as image files for you

 

https://gsap.com/docs/v3/HelperFunctions/helpers/imageSequenceScrub

 

Hope this helps!