Shifting Background Video

Hello, and good evening. Is there a way to shift a background video so that it is centered and not starting at the top?

Hello @SE1217707,

Thank you for reaching out.

We may need to inspect the element with the background video to provide the appropriate modification. Please provide the site URL in the secure note and include the login details if possible.

Best regards.

Thank you! I have added it

Thank you for the info.

We added this Element CSS to the Section to slightly move the video upwards.

$el .x-video .x-video-inner video {
	transform: translateY(-60%);
	top: 50% !important;
}

If you’re interested in this kind of modification, kindly check our One service.

Best regards.

Thank you! Do you know why the logo has a white background as it loads on top of the video? I was hoping the video would appear immediately and the logo would load on top of it slowly? Instead, I am seeing the logo appear slowly with a white background, and once fully loaded the background video appears

Hello @SE1217707,

Thanks for updating in!

You can add an animation delay so that there will be some time for the logo to appear.

Cheers.

Yes, the issue is that the animation is showing a white background when it should just slowly appear over the movie. The movie is not loading upon the page loading, but only AFTER the animation finishes loading. I believe this is a glitch, as the movie should load immediately upon the page loading, and the logo slowly enter on top of it. Can you please help?

Hello @SE1217707,

I would recommend that you move the background video to background upper and set a black background color so that while the video is loading, a black solid background displays. Be advised that background colors appears first before the video loads.

Hope this makes sense.

I am a bit confused - why is the video not loading upon the page loading? Shouldn’t it load immediately?

The video will display when it’s done buffering or when it’s fully loaded. You might notice a short delay, depending on the speed of your connection and the size of the video. As suggested above, you can add another background layer, which will display while the video is loading.