我搜索过去两个小时，但无法找到解决这种情况的方法。
我有一个网站，我允许用户“弹出”来自第三方的嵌入式视频流，例如justin.tv。当他们这样做时，我在窗口放了一个小的全宽标题，除了顶部的10px外，它主要是隐藏的。
当它们悬停在10px区域时，标题会扩展到内容中，为它们提供一些菜单选项，例如“弹回”。
问题是，无论我做什么（纯css，css / js等），我都无法得到它，以便在每种情况下都是：
嵌入的视频将占用窗口中的所有剩余空间，我们永远不会在窗口中看到滚动条。
我已经让它“大部分”使用javascript来调整div的大小，但它与jquery.animate（）函数一起使用效果不好，它正在处理更改标题的高度。
感谢任何帮助！
修改
可以在以下位置找到一个半工作示例：
http://wellplayed.org/channel/now_live
根据您在阅读本文时的实际频道，点击其中一个，然后在“查看流”页面中，找到左上角的“弹出流”按钮。
请注意，我已经更正了一些在我的开发环境中完成此操作的方法，因此它不像那样那么糟糕。
答案 0 :(得分：0)
感谢你发布了你想要做的事情的视觉效果
我认为在这种情况下，如果你使用绝对定位会更容易，那样只有一个需要操纵的变量（顶部坐标），你不需要做调整大小的功能，AP（绝对定位）也将照顾到这一点。
本质上是你需要div，bar和视频容器，同时制作动画，当它们动画时你还需要你的嵌入对象以相同的速度调整大小..我发现有方法太多的计算，即便如此我也无法以任何速度让对象与它的父级一起调整大小..所以我认为让CSS做为mych更容易，因为只需使用jQuery来移动位置
最重要的是要确保顶栏#stream-bar-hover始终是相同的高度..所以不要在其上放置填充等...，你已经有#stream-bar所以任何装饰可以放在那里
我认为根据你的HTML，左上角的图像是38x38，但如果你希望它更小，你可以计算下一位，当我添加1px边框和2px填充和2px边距时#stream-bar这意味着“悬停栏的高度必须为48px（我确实添加了溢出：隐藏以防万一;）”
然后绝对定位#stream-bar-hover和#stream-popup，使其中两个填充屏幕的各个部分，以便top: 0;为条形，top: 48px;为视频容器，这两个div的左右底部坐标永远不需要通过改变最后一个你的延迟函数和悬停函数都可以工作，你只需要同时为两个div顶部坐标设置动画
这个方法的优点是它不需要window.resize（）函数，我认为你的方法会