javascript - videogular 裁剪视频而不是调整大小

标签 javascript css angularjs videogular

我有一个原始尺寸为 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,

我做错了什么?

最佳答案

这对我有帮助。 只需将其放在视频所在的 CSS 文件中即可。

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

显示为 FLEX

关于javascript - videogular 裁剪视频而不是调整大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30146285/

相关文章:

angularjs - 如何从路由器请求中获取值(value)?

javascript - angularJS:WAITING ng-if 完成,以确保 DOM 已准备就绪

javascript - 从javascript制作的列表中更改一个元素的CSS

javascript - 统一风格的分享按钮

javascript - 实现 Angular ui-router 而不是 ng-router

html - 并排放置两个 flexslider?

javascript - 带有 Flash 内容的 iframe html 页面为下拉菜单创建问题

javascript - 如何将 javascript 变量值存储到 html 输入值中?

javascript - 如何使用javascript添加两个文本框值

javascript - 使用 d3.js 的组元素 (<g>) 的渲染顺序