Start playing a video when a user scrolls and a video is in view

Design help Custom code
1

Hey there,

I was wondering if it’s possible to play a video when a user scrolls and a video is in view?

Thanks for your help.

2

Hi @Arno you may find this resource helpful: javascript - Autoplay Youtube Video When Scrolled to - Stack Overflow

3

Hi @Waldo,

Thanks for the link.
As I’m not a senior dev, so I have 2 questions:

  • Does it works with a video embedded in an embed block?
  • Can I use this kind of code then (for the video):

`

`

Thanks for your help :pray:

4

Any Ideas? :cry:
Please
Thanks

5

Hi @waldo, I still cannot achieve this, do you have any idea how I can do it? Thanks :pray:

6

Hi @Arno, do you have a read-only link to the site that you are trying to implement the video scroll code from the Stack Overflow page? It seems like that should work.

If you have a test page, it will be a lot easier to help get it working. Share a read-only link | Webflow University

7

Hi @cyberdave I don’t have a website ready yet, but I’m gonna create a prototype and post the link here. Thanks :pray:

8

Hi @cyberdave @Waldo here is the link to my prototype: Webflow - Test Video On Scroll

I did succeed in making the YouTube Video play on scroll :slight_smile:
but didn’t manage to make it responsive even if I tried the spec found on [Tutorial] Responsive Video using HTML Embed - Webflow Tips - Forum | Webflow

Any ideas how to make it responsive?

Thanks.

PS: Here is the link to the live website: http://test-video-on-scroll.webflow.io/

9

Any answer of how to get embedded to play on scroll?

10

Hello @joealterio I need to explore more with this experiment. I’ll let you know if I find the way to do it with embedded videos.

11

Maybe this plugin work Player.js: Scroll Demo

12

Thanks @AntonioBalderas I tried to implement it into webflow but didn’t manage to make it work yet.

13

Oh wow, that’s bad ass. Thanks! I’ll try to futz with it tonight.

14

Weblow have made it work on their new website, lets ask them to help answer this for the community hey @PixelGeek ??

1 Like