How can I fade audio when scrolling past video player?

Ask the community
,
1

Hello! This may not be possible, but is there a piece of code that will allow audio to stop playing when a user scrolls past the video it is embedded in? My video is an uploaded MP3 and I have it attached to the Wix Video Player. It appears to be available without code in the Editor X, but not the Wix websites. Thanks in advance!

2

You can try something like:

$w.onReady(() => {
    $w("#videoPlayer1").onViewportLeave(event => {
        if($w("#videoPlayer1").isPlaying){
            $w("#videoPlayer1").pause();
        }
    })
})
3

J.D. didn’t the post-opener wanted to stop video, or the audio of current video ?

Not sure, what the post-opener is trying to achieve.

Something like…?
https://russian-dima.wixsite.com/meinewebsite/blank-21

4

@russian-dima I’m not sure either, so he/she can add details if needed.

5

Hi russian-dima, thanks for your reply. Yes, I want to start and stop the video upon scrolling to, and scrolling past (respectively) the video. I hope that made sense.

6

So you mean, the given example, is that what you want to achieve?
(Did you scroll up and down ?) :grin:

7

So use the code I posted above and if you want to resume once it gets into viewport again then:

$w.onReady(() => {
    $w("#videoPlayer1").onViewportLeave(() => $w("#videoPlayer1").pause());
    $w("#videoPlayer1").onViewportEnter(() => $w("#videoPlayer1").play());
})
8

@russian-dima no there wasn’t anything on that link that had anything to do with video. Am I missing something on there?

9

@russian-dima Here is what I am trying to achieve through WIX (see link below). I created this site using Editor X and the Home page video works great and quits playing the music when you scroll down. If you scroll back up, the sound starts playing again. Also, the sound plays automatically. It’s everything we hoped to achieve.

However, we decided the Editor X is too hard to use for my client, so I created another site through Wix. I cannot duplicate this feature on the Wix site. Any suggestions?

https://equi-9.editorx.io/mysite