-
AuthorPosts
-
September 3, 2022 at 11:46 am #1363736
Dear support team,
I am having an issue with the Video element, the option “Show in lightbox – loads after user interaction – preview image recommended” doesn’t seem to work as it should across the whole website.
The fallback background image for the video is never showing with the Lightbox option selected, and this is happening only on the English version of the page.
Here it is working just fine
Link 1Here we have an issue with the background image
Link 2If you inspect the element (youtube element inside the second section of the website) you will see that the image you see in the preview is actually hard-coded in the CSS, it doesn’t come from the element background option.
I am using the WPML and the selected images are translated to coresponding language.
Thank you for your time and how hard you work, any help would be appreciated :)
Lukas
September 5, 2022 at 10:24 am #1363883Hey valorum,
Thank you for the inquiry.
Fallback images will only display on mobile devices where background videos are usually not allowed to play as inline element. Please note that the image will not display on desktop view as a slider preview if that is what you are expecting.
Best regards,1
IsmaelSeptember 6, 2022 at 10:24 am #1364010Dear support team,
Dear Ismael,Sorry but I think that you are missing my point here. The same element behaves differently in different languages, please check the link in my previous message.
That image is not only a fallback image, it’s also a preview image especially useful for lazy video loading, and sometimes it’s shown, and sometimes it’s not (on desktop devices)
Could you please take a deeper look into this?
Thanks
September 7, 2022 at 7:14 am #1364150Hi,
Thank you for the update.
The sliders on both links above behave the same when we checked. Are you aware that there is a mobile version of the video section with the mobile-banner ID? This css was also added to apply a background image with overlay.
#mobile-banner { height: 99vh; border-bottom: 20px solid #005499!important; display: flex; align-items: center; aspect-ratio: 1; min-height: 99vh; background-repeat: no-repeat; background-image: url(https://staging-mediconomicscom.kinsta.cloud/wp-content/uploads/bg-img-overlay-201x300.png); background-position: 50% 50%; }Would you mind providing a short clip of the issue? You can use imgur or dropbox for the screencast. Thanks.
Best regards,
Ismael -
AuthorPosts
- You must be logged in to reply to this topic.
