屏幕尺寸改变时如何改变div尺寸?

问题描述 投票:0回答:1
html jquery web responsive-design
1个回答
0
投票

您需要在

resize
事件上设置所需元素的宽度和高度。请参阅以下示例。

var width = $(this).width();
var height = $(this).height();

$(document).ready(function() {
  $("#main-page").width(width).height(height);
});


$(window).on("resize", function() {
  width = $(this).width();
  height = $(this).height();
  $("#main-page").width(width).height(height);
  $("#height").text(`Height: ${$("#main-page").height()} Width: ${$("#main-page").width()}`);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<div id="main-page">
  <div class="container-fluid p-0">
    <div class="row">
      <div class="col-lg-12">
        <div id="height" style="color: wheat;">

        </div>
      </div>
    </div>
  </div>
</div>

© www.soinside.com 2019 - 2024. All rights reserved.