视频/图像滑块调整大小以适应屏幕（宽度和高度）

Question

我使用此滑块代码显示我的图片和视频：

Code: https://codepen.io/1wdtv/pen/jbjZeb

然而问题是滑块仅在宽度时才响应。这意味着如果您调整浏览器的大小，它将使用它调整图像/视频的大小，而不考虑其高度。

是否可以使视频/图像与高度和宽度完全匹配？

我希望它们在屏幕上显示，无需向下滚动以查看视频/图像的其余部分。 即使这意味着拉伸视频/图像

谢谢

Answer 1

您可以将其添加到CSS：

.slider-video {
  height: 100%;
}
video { 
  object-fit: fill;
}

这将占据整个高度。并且它将伸展以填充宽度。这可能会扭曲视频，但你说这是可以接受的。