Feature request - background video positioning

Beta
#1

Hi @charlie,

I have had this problem in the past and I have been seeing a few others on the facebook group having a similar issue so thought it might be worth a native solution.

Using the starter stack, any background video are positioned left 0 top 0. for most use cases a center center approach would be better, but what would be better again would be a positioning input on the video (in the same way that exists for background images)

I have used code like this to force the issue in the past but I think this would make life easier for quite a few people if it was an option on the background layer video (to create a center bottom focus to the video)

$el .x-video .x-video-inner .x-mejs .has-stack-styles {
top: auto !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
}

Thanks in advance!

image layer
image layer678×924 48.5 KB
video layer
video layer682×948 47.8 KB

#2

Have you tried center center or 50% 50% ? If I recall correctly, css requires both values

#3

@Jonson Please point out the where ‘Position’ exists on the VIDEO screenshot

#4

@scotbaston where your arrow is pointing, in the first image. The “Position” is below “Size” and above “Parallax”
That’s where you would enter center center or 50% 50%, which correlates to: top/bottom value and left/right value.

Additional reading:

#5

Just to clarify, did you read my post?

the arrow on the screenshot is on the IMAGE background layer, this post is asking for the same functionality on the VIDEO screenshot beneath it

2 Likes
#6

@Jonson - @scotbaston is asking for the functionality of positioning the image background to also be applied to the video backgrounds.

I’ve used this to achieve it recently:
$el .x-mejs {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: cover;
}

but it’d be great if there was a more native control.

5 Likes
#7

Oops, I totally missed that somehow. That’s my bad. Thanks for clarifying @RubberDuckers

#8

We’ll add in controls for this eventually. We might have to setup breakpoint controls first to the background controls to fully complete this first though.

Thanks @RubberDuckers for the reference.

1 Like