videogular 裁剪视频而不是调整大小答案

【问题标题】：videogular crops video rather than resizingvideogular 裁剪视频而不是调整大小
【发布时间】：2015-05-09 23:53:49
【问题描述】：

我有一个原始尺寸为 1920x1080 的视频。我正在使用基本设置教程中的 css，但尝试将 css 中的默认高度设置为 1080：

.videogular-container {
    width: 100%;
    height: 1080px;
    margin: auto;
    overflow: hidden;
}

@media (min-width: 1200px) {
    .videogular-container {
        width: 1170px;
        height: 658.125px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .videogular-container {
        width: 940px;
        height: 528.75px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .videogular-container {
        width: 728px;
        height: 409.5px;
    }
}

这似乎是溢出的东西 - 它只是隐藏了视频的其余部分，而不是实际调整它的大小。

在配置中我有这个设置：

width: 1920,
 height: 1080,      
 responsive: true,

我做错了什么？

【问题讨论】：

您能否提供指向您项目的实时版本的链接？
不，抱歉。它在我的本地服务器上...
您使用的是什么 Videogular 版本？宽度、高度和响应是早于 1.X.X 版本的参数。从 1.X.X 版本开始，Videogular 始终表现为响应式视频播放器，宽度和高度始终为 100%
它是 1.2.1 它是响应式的 - 它根据屏幕宽度调整视频区域的大小 - 问题是它调整了区域（视频容器）的大小，而不是视频本身，结果我看到了裁剪的视频。

标签： javascript css angularjs videogular

【解决方案1】：

这与答案Controls font/symbols missing - videogular有关

您需要为 Videogular 主题设置正确的 url。

【讨论】：

【解决方案2】：

这对我有帮助。放在视频所在的 CSS 文件上就好了。

video {
  width: 100% !important;
  height: auto !important;
}

显示为 FLEX

【讨论】：