当我最小化浏览器时如何缩放 div，以便 div 不会相互折叠 [英] how to scale divs when i minimize browser so that divs dont collapse over each other

问题描述

我有一个小问题.如果我最小化窗口，如何设置 2 个 div 的高度，以便它们不会折叠而是动态缩放?我在 js 中做了这个:

i have small question. how is it possible to set the heights of 2 divs so that they dont collapse but rather scale dynamically if i minimize the window? i did this in js:

$(document).ready(function(){
    var footer = document.getElementById('footer').offsetHeight;
    var sidebar = document.getElementById('sidebar').offsetHeight;
    document.getElementById('sidebar').style.height = sidebar - footer + 'px';

});

这是有效的，但在我最小化时无效，我是否必须在函数中执行它并在 window.load 左右调用它?现在的问题是，当我最小化浏览器时，div 又会相互重叠..

this is working but not when i minimize, do i have to do it in a function and call it during window.load or so? the problem now is that when i minimize the browser, the divs are going over each other again..

谢谢

推荐答案

我觉得你需要绑定到resize事件

I think you need to bind to the resize event

$(document).ready(function(){
  var sidebar = document.getElementById('sidebar').offsetHeight;
  $(window).resize(function(){
    var footer = document.getElementById('footer').offsetHeight;
    document.getElementById('sidebar').style.height = sidebar - footer + 'px';
  });
});

这篇关于当我最小化浏览器时如何缩放 div，以便 div 不会相互折叠的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！