Video cover and responsiveness in header

Support
#1

Hi!

I just started editing a new header. I stumbled upon an issue that I cannot seem to solve, and that is the responsiveness of the video, especially when resizing the window. Where it should follow along, the video stays the same in the background. I want it centered all time and full height. No problems if the sides are cropped.

The video loads responsive, but the issue appears when resizing windows.

Thanks for a great theme!

//Christoffer

#2

Hello Christoffer,

Thanks for writing in! Actually, resizing the browser window is not the correct way of testing it. Be advised that when the video was loaded by the browser, the browser uses your computer resources in rendering the page contents, graphics, and videos. By resizing the browser window, the page elements, contents, graphics, or videos need to be rendered again by the browser to be able to see that those elements are displayed properly. In most cases, it takes time for the browser to rerender the page. This is why you will see first that the video does not follow the browser width right after you resize the browser window. After a few moments, the video gets displayed properly again displaying with the same width of the browser window. This delay is how the browser rerenders the page. It may vary from computer to computer. If you have a less powerful computer, the delay may take longer. When using a gaming laptop or a more powerful computer, you won’t be seeing any difference as you resize the browser window.

Hope this explains it briefly.

#3

Hi and thanks for your answer!

I’m on a MacBook Pro 16" M1, so it should render rather quickly. :stuck_out_tongue: :stuck_out_tongue:

Is there any way to edit the position of the background video, like for images? (cover, center, fit, etc.)

I’ve put the video in the upper layer, but I’m failing to reach it with css.

Sincerely

Christoffer

#4

Hey Christoffer

Please check out my video screencast:


(please wait for a few moments while Youtube is rendering the HD version)

Noticed that when I resize my browser, it takes a few moments before the video realigns itself.

Hope this helps.

1 Like
#5

Thank you for your time to make that video, @ruenel! Appreciate it. I didn’t realise it would re-render and it actually did at my laptop too, except for when I shrank the screen to as small as possible. Somewhere there seems to be a breakpoint with different settings so that the video is displayed from the left side, instead of being centered.

But I’m not finished with this site yet, and it looks rather clumsy in my eyes, so I won’t take your time on this more now. I was mostly interested in if I could reach the background video with css with some $el. codes. I’ve tried but never made it with the background video.

Thanks for great support. You and your team provide the best support I’ve ever seen in the Wordpress area.

#6

You are most welcome, @Christoffer_Ahlback.

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.