我有一个链接，点击时需要向上滑动或向下滑动（取决于状态）包含响应全宽视频的DIV。由于它的响应和宽屏视频高度无法修复（我现有的代码执行此操作并需要更改）。必须在页面加载时隐藏此DIV（包含视频）。
我现有代码：http://jsfiddle.net/D5EMp/在某种程度上可以隐藏/显示视频。但是，主要问题是视频的高度在页面加载时可见，并创建一个空格。
我需要视频向下/向上滑动并从水平黑条淡入/淡出，而此区域下方的内容会在showreel状态发生变化时被按下或拉起。
奖励将是添加功能，当点击链接时，页面滚动到该开放DIV。
答案 0 :(得分：3)
你在css中添加的填充导致了这个差距：
padding-bottom: 56.25%; /* 16/9 ratio */
padding-top: 30px; /* IE6 workaround*/
你可以在显示时填充此填充example here，但它似乎会导致视频在Firefox上变得混乱。
在尝试设置该高度的动画之前，我会计算出正确的高度，而根本不使用填充。要获得16/9视频的正确高度，只需将宽度除以16，然后乘以9.工作示例：
要将页面自动滚动到视频的顶部，您可以将其作为动画的完整功能放入：
function(){$('html, body').scrollTop($('#showreel').offset().top);}
答案 1 :(得分：0)
空白区域来自您在#showreel上设置的填充，只需删除它。
查看http://jsfiddle.net/D5EMp/1/
最大的问题是如何知道视频的大小。但在我看来，在加载之前无法知道视频的大小。访问iframe会导致一些跨域问题。
em，您可以搜索另一种解决此问题的方法，而不仅仅是技术
这是我的想法