0

我正在尝试在ZURB 基础部分（又名选项卡）中添加 Vimeo 视频。整个<section>是响应式的，标签内的视频也应如此。为了使视频播放器具有响应性，我使用了 Foundation 的内置Flex Video。

打开视频部分时，<section>高度为零（或接近零）。我曾尝试使用该reflow方法，但该路线没有运气。

有没有办法<section>在打开部分后重绘 , 或者它的内容？

这是问题的 JSFiddle - http://jsfiddle.net/brettdewoody/8KKGS/

4

2 回答 2

1

伙计们，这是我提出的问题。我相信 Foundation 应用风格的方式并不是最好的方法。

这是由于将 padding-bottom = 0 应用于节中的最后一个元素引起的。您现在可以通过将其放在 .scss 某处来覆盖它：

.flex-video {
    padding-bottom: 67.5% !important;
}

这里有一个永久修复的拉取请求： https ://github.com/zurb/foundation/issues/2412

以及我提出的解决填充问题的问题： https ://github.com/zurb/foundation/issues/2502

希望这可以帮助

于 2013-06-03T09:44:52.397 回答
0

经过一番修修补补，我找到了一个 hack-ish 解决方案，它使用占位符图像来保持正确的大小。一个警告是图像必须与视频的比例相同（或几乎相同）。不完美，但它有效。

我还不得不更改<section>一点但没什么大不了的 HTML。

这是一个显示解决方案的 JSFiddle。

希望它可以帮助某人。

于 2013-05-29T22:04:55.733 回答