Placing a Button over Video

Visual Editor Help
1

I might be doing something wrong but when a button is placed over a video component the button is no longer clickable.

Any idea on how I could fix this?

2

I can set the video to a background but I feel like this will affect the performance of the site?

3

Hi @MikeM, Welcome to Builder.io Forum!

Could you please share the builder content entry link where you’re facing this issue in implementation?

4

Hey thanks,

Is this the link you are referring too?

image

When placing a button within a photo the button is still usable but when placed within a video it is not. I tried playing with the zindex but no luck.

5

@MikeM, Thanks for sharing this, looks like you are running on localhost so I will not be able to test it directly.

I tried in my space and the button on the video works fine. I added z-index:2 to the button layer.

image
image2848Ă—146 80.8 KB

6

Thanks for checking, is your button just visible or can you click it as well?

When I try this the button is visible but you cannot interact with it.

7

@MikeM
Sorry for not getting back sooner. Just wanted to follow up and check if you were able to get the button over the video to interact. The button over the video we tried was visible and able to interact as well.

Let us know if you have any other questions. Thank you!

8

Thanks for checking in, unfortunately I am not having much luck.

I believe Disabling “Fit Content” might have some effect on the usability of the button.

9

Hi @MikeM ,

Can I know what you are trying to achieve? and if you could share the Content URL ( the browser URL when visiting the content page ) where you are facing an issue? Or if you could send us a recording of the steps to replicate the issue would be great. It’ll help us better examine the issue.

10

Thanks for your help, I believe I found the issue it seems to related to the “Fit-Content” slider.

Here is a video of the issue: builderBug

11

Hi @MikeM ,
Thank you for sharing the recording. I tried to follow the steps to confirm if the button interacts. It seems to be working, I created a Element event on the button click. ( Here is a Loom)
Do you have an action/event set on the button click?

Let me know if you further questions.

12

Hi @MikeM - I wanted to follow-up and checked if you saw @OmPrakash’s comment and associated video?
Hope this helped solve your issue.

13

Yes I did,

I managed to get it working by playing with the “Fit-Content” slider and changing from just a button to a box that contained a button.

Thanks again

2 Likes