0

我是 ExpressionEngine(以及其他代码语言)的初学者。无论如何,我正在创建一个视频教程网站,我已经设置了我的表达引擎网站,所以我在一个频道中有类别。这些类别将内容过滤到相应的页面。但是,我希望我的网站有一个精选视频,这将是最新发布的视频。一旦我发布了一个新视频,我希望它占据主要舞台并将之前的视频推到更小的尺寸。我使用 Vimeo 作为视频主机,因此所有视频都将在 Vimeo 上。

这是我主页中用于从旧内容中排序新内容的代码

{exp:channel:entries limit="10"}
<div class="main_feature">

{if count==1}
<div class="video_large">
{/if}

{if count !=1}
<div class="video_small">
{/if}

<h2>{video_tutorial_title}</h2>
{video_tutorial_link}
{video_tutorial_summary}


</div>
{/exp:channel:entries}

我让它们过滤成两种不同的风格。我的CSS看起来像这样......

.video_large {
    height: 960px;
    width: 640px;
}
.video_small {
    height: 180px;
    width: 320px;
}

输入我的新内容/视频时。我一直在使用每个视频中的嵌入代码,并从它们中删除高度和宽度,认为 div 然后会调整它的大小。看起来好像它将所有视频的大小调整为 180x340,但对于最新的视频,它看起来像是创建了一个 640x960 div,视频只是没有填满整个 div。我希望我不需要任何插件或类似的东西。我希望它只是我忽略的一些基本的东西。任何帮助是极大的赞赏。谢谢!

4

2 回答 2

1

有一个名为FitVids的 jQuery 解决方案。它是为使用流体设计的网站而设计的,但在这种情况下它也应该可以工作。它会调整目标容器中的任何视频(在您的情况下.main_feature)以填充其父容器的宽度。

然后,您还可以从 CSS 中删除height声明(以便您可以容纳具有不同纵横比的视频)。

于 2012-12-13T15:02:38.143 回答
0

没有看到你的页面很难说,但我认为你必须将嵌入 iframe 的宽度和高度设置为 100%,然后它应该可以工作。

于 2012-12-13T20:25:09.010 回答