Disable hover and click on html embedded video

Hi, I’m using an html embed video header on my site ( see link ), is there any way to disable the hover state so it doesn’t have a grey overlay if the user moves the mouse over it?


Thanks in advance

Hi Theo! Please update your post and provide a read-only link to your Webflow project so we can take a look. Instructions are here. Thanks!

Thanks Chris, all done!

1 Like

Great, thank you! Specifically, we’re adjusting the “overlay” value in your code from true to false. This would not be a hard and fast rule for every video embed, but it seems to work for your custom code here. Let me know if this takes care of it for you! Update your custom code to the following:

<div style="padding-top: 56.25%; position: relative; overflow: hidden;"><iframe frameborder="0" allowfullscreen="" scrolling="no" allow="autoplay;fullscreen" src="https://onelineplayer.com/player.html?autoplay=true&autopause=false&muted=true&loop=true&url=https%3A%2F%2Fwww.dropbox.com%2Fs%2Fjnqxt9gowtkd3bz%2FMain_showreel_05_small_2.mp4%3Fraw%3D1&poster=https%3A%2F%2Fwww.dropbox.com%2Fs%2F308vg38jkq8w5v9%2Fshowreel_cover.png%3Fraw%3D1&time=false&progressBar=false&overlay=false&muteButton=false&fullscreenButton=false&style=light&quality=auto&playButton=false" style="position: absolute; height: 100%; width: 100%; left: 0px; top: 0px;"></iframe></div>

.HTML-Embed {
 pointer-events: none;

Amazing! that did the trick, thanks a lot for your help Chris!

1 Like

Great! Happy to help.