Looking for someone to implement ScrollTrigger

[Thepaulcollett 7 Likes (Newbie)]

Hey guys

 

I have a website: http://www.paulcollett.co.uk/index9.html  and need to have ScrollTrigger implemented in two (maybe three) sections. The first instance uses the GASP before and after scroll technique which works, but is covered in black from the second ScrollTrigger action which is to play a video on user scroll. Here is the demo I used or the code  

See the Pen 9e810322d70c306de2d18237d0cb2d78 by shshaw (@shshaw) on CodePen

 

It's sort of working, but as mentioned it creates a black square on one ST section, and the this particular section the scroll starts too soon so will need to be adjusted. Hope all that makes sense, if anyone out there can fix this, you'll be a god send.

 

Many thanks

[Abi Rana 11 Likes (Newbie)]

Your main issue is with video encoding, please check that first. Above codePen has also mentioned it on its code block.

 

The encoding is super important here to enable frame-by-frame scrubbing. You should try following:

ffmpeg -i ~/Downloads/Toshiba\ video/original.mov -movflags faststart -vcodec libx264 -crf 23 -g 1 -pix_fmt yuv420p output.mp4
ffmpeg -i ~/Downloads/Toshiba\ video/original.mov -vf scale=960:-1 -movflags faststart -vcodec libx264 -crf 20 -g 1 -pix_fmt yuv420p output_960.mp4

 

You can test with above (codePen's) video to make sure that your code is working. By the way, I've tested on your site so code is working only the video should be fixed.

[Thepaulcollett 7 Likes (Newbie)]

Hey Abi

 

Thanks for replying. I'm not sure I understand. I'm such a newbie at HTML let alone Java. Is this something you could fix? 

[Abi Rana 11 Likes (Newbie)]

I think fixing the video would do the work for you. I've encoded the video and uploaded in my Google drive, get the video and upload on your site, this should fix the issue.

 

https://drive.google.com/file/d/1dYjhZd8SWJvCE_cDu9Xk5s1nm6eMPaml/view?usp=sharing

[Abi Rana 11 Likes (Newbie)]

But if that still doesn't fix your issue or if you need more help then let me know.  You can dm in private and we can discuss ahead. By the way, I do need a little flexible time.