Jump to content

How to play a video that is under an image

Go to solution Solved by jimzdano,

Recommended Posts

I have a video and an image. The image layer has to sit on top the video player to give it a nice border and visual overlay.

Because the image is on top the video you are unable to click to play the video!

I have tried pointer-events:none to the image but it doesn't work as intended:

//image//

#block-yui_3_17_2_1_1710853880296_59055{
  pointer-events:none!important;}

//video//

#block-yui_3_17_2_1_1710853880296_61979{
  pointer-events:auto!important;}

Any thoughts?? There's got to be a way to click through the image to play the video!

Thanks in advance!!

https://www.missjessliteracy.com/kidscourse

password55

Link to comment
  • Solution
15 hours ago, tuanphan said:

Or use this CSS code, but it has a laggy

.fe-block-yui_3_17_2_1_1710853880296_59055:hover+div {
    position: relative;
    z-index: 99999 !important;
}

 

Dang yea that is really laggy and flickers when you mouseover and requires a lot of clicks before the video actually plays. The autoplay is not an option for me unfortunately. 

Wow I actually just got it to work by placing the image next to the video and using 

{transform : translateX( 87% );
pointer-events:none;}

Can't believe that worked! Finally!!!

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.