javascript - CSS 和 jQuery 制作一个滑动面板,将另一个 div 水平推,而不是向下推,并且右侧面板必须填充所有页面

标签 javascript jquery css html

我有两个 div 元素,一个是隐藏的左侧面板,并根据需要折叠/展开。在右侧,我有另一个必须推送的 div,其中包含一个 iframe,此 iframe 必须填充所有屏幕或屏幕的剩余部分。现在,左侧 div 正在将右侧 div 向下推。

Here是我拥有的代码,红色边框代表我的左面板(折叠/展开)。带有iframe的代表右边。

你能帮我吗,让左边的面板水平插入另一个面板,右边的面板相应地调整以适应窗口。

最佳答案

首先,我不认为寡妇宽度相关的脚本是最好的解决方法。

其次,避免像瘟疫一样使用 CSS height:100%...它效果不好,您可以将 window.height() 传递到变量中并使用 jQuery 设置它们。

第三,您可能希望定位 iframe 以及外部 div。

http://jsfiddle.net/eteich/cZjMR/8/

关于javascript - CSS 和 jQuery 制作一个滑动面板,将另一个 div 水平推,而不是向下推,并且右侧面板必须填充所有页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11619423/

相关文章:

javascript - 如何将两个参数传递给 3rd 方组件回调属性?

javascript - 如何使用 React Native 在 Android 上使用与 ios 相同的自定义字体

javascript - 使用相同的页面 anchor 击后保持链接事件

css - 使用 modernizr 检测 vh,vw 和 calc

html - 标签标记中的 "For"

javascript - jQuery UI - 动态设置可调整大小元素的 minHeight

javascript - 从下拉 Bootstrap 中选择的选项

javascript - 如何打印特定的 HTML 图像

asp.net-mvc - 使用ajax调用将模型从 View 传递到 Controller ?

javascript - 从 mapbox 隐藏子层名称链接,然后在单击其父层时使其可见