个人中心
gpt4 book ai didi

javascript - 获取div中可用空间的高度和宽度

转载 作者：行者123 更新时间：2023-12-03 12:44:42 33 4
gpt4 key购买 nike

我在一个div内有几个div，我需要获取主div内空白区域的高度和宽度。

我还没有 javascript，因为我不知道从哪里开始。

HTML:

<body>
    <div>
        <div class="w1">

        </div>
        <div class="w2 h2">

        </div>
        <div class="w3 h2"></div>
    </div>

CSS:

<style>
        div {
             border:1px solid #000;
             width:1000px;
             height:1000px;
             position:relative;             
        }

        div div {
            border:1px solid red;
            float:left;
            height:300px
        }

        .w1 {
            width:600px
        }

        .w2 {
            width:395px;
        }

        .w3 {
            width:300px;
            top:-300px;
        }

        .h2 {
            height:600px;
        }
    </style>

有人知道如何获得这个吗？

enter image description here

最佳答案

当调整窗口大小和加载页面时，您可以使用事件resize来计算所有div的高度和宽度

$(document).ready(function () {
      window.onresize = function () {
          RefreshSize();
      }

      RefreshSize();
});

如果每个div都有一个id，则使用高度和宽度

function RefreshSize(){
     var wCenterDiv = $(window).width() - $("#oneDiv").width() - $("#secondDiv").width();

     var hCenterDiv = $(window).height() - $("#oneDiv").height() - $("#secondDiv").height();
}

等等

看看这个例子

http://jsfiddle.net/7W7b9/

关于javascript - 获取div中可用空间的高度和宽度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23381130/

33 4 0
文章推荐： javascript - 加载图表后 Highstock 更改 xAxis minRange
文章推荐： r - 从ggplot条形图中删除未使用的因子水平
文章推荐： events - 如何触发传单 map 多边形上的事件？
文章推荐： Javascript 存储凭证(主干)
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com