问题是:
我们可以让窗口根据内容调整大小,但是当窗口调整大小时,高度不会动态改变,要么在下方留下大量空白,要么将内容隐藏在页面其余部分后面。
代码如下:
HTML:
<div class="panel-container" style="height: 706px;">
<div class="control-panel create-job flexible">
<div class="column-container">
JSX:
resizePanel: function (height) {
this.refs.panel.style.height = height + 'px';
},
getPanelContainerStyle: function (controlPanel) {
if (this.state.isPanelOpen && _.isObject(controlPanel)) {
var height = controlPanel.type.prototype.height;
if (_.isNumber(height)) {
return {height: height};
} else return {height: 100};
} else return {};
},
CSS:
.panel-container
height 0
transition height 0.3s
margin-top bump-lg px
margin-bottom bump-lg px
非常感谢任何帮助!
最佳答案
您尝试过使用视口(viewport)单位吗?您可以在此处找到更多信息 https://teamtreehouse.com/community/resizing-div-automatically-depending-on-screen-size
关于javascript - 允许窗口在转换后动态调整大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45947586/