Empty upper background content (video) causes darkening of lower content

Support
#1

Hello,

Setup: I want to fill a div’s background using one of two options: an “upper” layer (a video with a dynamically passed link: {{dc:param:video}}) and a “lower” layer (an image). When the video link is empty, the image underneath should be visible. For various reasons, I am deliberately using separate upper and lower layers rather than the poster image function.

Problem: When the video link is empty (nothing passed), I can see the image in the lower layer, but it appears slightly darkened.

Current workaround: I am using two separate elements and applying conditional logic based on the presence of the video link.

Can you reproduce this and tell me why it’s happening?

#2

Hey Daryl,

Thanks for writing in!

Yes, I was able to replicate your issue on my local test server. When the video link is empty, there is no way of knowing that it is empty if we use custom CSS. You are on the correct path using two elements and conditions to determine the video link first, then displaying the upper color background. This is the easiest workaround, as the other may need custom JS to detect the video, which could get complicated.

Best Regards.

#3

Ok, thanks

#4

You are most welcome, Daryl.