HTML5 Play/Pause hover won't work correctly in Element Grid

[borbold]

Hello,

I was trying to implement a code mentioned in another thread. This one:

<script> 
        window.laytheme.on("newpageshown", function(){
        jQuery('video').each(function(){
           this.pause(); 
        });
        jQuery('video').on('mouseenter', function(){
           this.play(); 
        });
        jQuery('video').on('mouseleave', function(){
           this.pause(); 
        });
    });
</script>

It does function kinda properly pausing when I am not hovering them, but when I am entering the page the videos are all already playing. They should already been loading as paused right from the beginning and should only be playing when I am hovering them, right?

The elements I am using are in an element grid, could this be the problem?
Also I am using another code I found to create a onepager menu, but as I removed it the problem above stayed the same.

I can't post the URL public, but I can send it via message if someones up to my problem. :-)

Thank you!

[arminunruh]

hey

my own code in lay theme is making html5 videos play that are in-view and set to autoplay as far as i know

when you edit your elementgrid, double click the video (not in the preview, but on the left side where you can re-order elements)

in there make sure you have turned autoplay off

[borbold]

At first: thank you for your quick reply armin!

I see! But I am afraid its not solving my problem... When I turned autoplay off no videos are playing at all, not even when I am hovering them. That was functioning before

So I want still images, but when hovering them I want the video to play. I tried different codes by now but I end up with the same two results every time.

1. still video, not playing at all
2. hover video function works, but I have to hover the image once so it freezes once

Any further ideas?

I'm afraid I have to really start learning jQuery to solve stuff like this. In my head I know what could be the problem, but I can't express it properly with code by myself.

For example would it be possible to do a workaround by replacing the "play by click" function with the hover function?

[Richard]

Dear @borbold

Did you get any further with your problem? :)

Best wishes for 2021
Richard

[borbold]

@Richard-K

Hey Richard! Thank you so much for asking. Sadly I didn't had any luck yet. I tried a lot more and then I just let it be

But the page released you can have a look at what I mean: https://bloqmagazin.de/

all the best

[borbold]

@borbold https://bloqmagazin.de/#team

thats the clickable videos that I originally wanted to play on hover