为什么 JWPlayer 在视频上方和下方显示黑条？答案

【问题标题】：Why does JWPlayer show black bars above and below videos?为什么 JWPlayer 在视频上方和下方显示黑条？
【发布时间】：2017-08-26 16:59:35
【问题描述】：

当在 iPhone 或 android 智能手机上以纵向模式播放视频时，JWPlayer 6 会在视频上方和下方显示黑条，但在横向模式下则不会！当视频播放器宽度减小到 320 像素或更少时，iPad 上也会发生同样的情况。我用于测试的视频长宽比为 16:9，元数据宽高分别为 640、360。

为什么会发生这种情况，更重要的是，如何在不拉伸/裁剪使用不同“拉伸”值（“fill”、“exactfit”、“none”）导致的视频的情况下移除条形？

链接：http://jsfiddle.net/hRAKQ/17/

JS代码：

var jw = jwplayer("test").setup({
    file: "http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4",
    image: "http://lorempixel.com/320/180/sports/7/",
    width: 320,
    height: 180,
    autoplay: false
});

【问题讨论】：

标签： jwplayer

【解决方案1】：

此代码将起作用：

var jw = jwplayer("test").setup({
    file: "http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4",
    image: "http://lorempixel.com/320/180/sports/7/",
    width: 320,
    height: 180,
    autoplay: false,
    stretching: 'exactfit'
});

【讨论】：

正如我在上面的帖子中所说，这不是一个好的解决方案，因为它不仅会通过垂直拉伸海报/视频来扭曲它们，而且还会扭曲 iPad iOS5.1 上的播放器栏（例如进度条消失）。
您可以尝试的另一件事是填充。
另外我建议从 6.1 更新到 6.5。
我已经尝试了所有各种拉伸选项，填充来自壁橱，但即使这样也会增加视频高度。为什么所有尺寸都正确时会出现黑条？
升级到 jwplayer 6.5 也没有解决问题！ :(

【解决方案2】：

我也有类似的问题。尽管黑条仅出现在底部并且仅在单击播放按钮时才出现。我让我的视频 div 元素上的字体大小设置为零的 css hack 工作。所以在你的小提琴例子中它会是这样的

<div id="test" style="font-size: 0"></div>

【讨论】：