Trung tâm cá nhân
cuốn sách gpt4 ai đã làm

Làm cách nào để thay đổi chiều cao div nếu chiều cao trình duyệt nhỏ hơn số pixel nhất định?

In lại Tác giả: Vũ trụ không gian Thời gian cập nhật: 2023-11-03 20:00:14 25 4
mua khóa gpt4 Nike

我有一个 div，我希望它是两种尺寸中的一种。

  • 如果浏览器窗口高度小于给定高度，则它使用较小的高度作为 div
  • 但是，如果浏览器窗口高度大于给定高度，则它会为 div 使用更大的高度

我尝试了以下代码，但它不起作用。我需要帮助才能让它正常工作。

这是 jsbin:http://jsbin.com/oFIRawa/1

Đây là mã hiện tại của tôi:

page.html

 

样式.css

#theDiv {
    background: #000;
    border: 2px solid #222;
    chiều rộng: 300px;
    height: 400px;
    margin: 50px auto 0 auto;
}

script.js

$(document).ready(function () {
    // call the method one time
    updateWindowSize();
    // subscribe the method to future resize events
    $(window).resize(updateWindowSize);

    // biến
     var updateWindowSize = (function(){
        var minAllowedWindowHeight = 500;
        var largerDivHeight = 400;
        var smallerDivHeight = 300;

        // actual updateWindowSize function
        hàm trả về(){
            var winHeight = $(window).height();
            var newHeight = winHeight < minAllowedWindowHeight ? smallerDivHeight : largerDivHeight;
            $('#theDiv').height(newHeight);
        };
     })();
});

câu trả lời hay nhất

我的好先生，您可以在 CSS 中做到这一点。这叫做响应式设计!

@media (max-height:500px) {
    Enter special css conditions for 500px height.
}

@media (max-height:200px) {
    Enter special css conditions for 200px height.
}

这更常用于最大宽度，因为它可以告诉我们何时有人在使用移动设备(例如 360px 最大宽度)，然后我们可以修改我们的页面以使其在移动设备上看起来更漂亮。不需要花哨的 javascript!

关于javascript - 如果浏览器高度小于给定的像素数，如何更改 div 高度？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19428525/

25 4 0
Bài viết khuyến nghị: python - 矢量化 softmax 梯度
Bài viết khuyến nghị: javascript - 如何在 Chrome 中显示一个 div，但使其完全不具有交互性
Bài viết khuyến nghị: python — Các biến trong biến mẫu Django
Bài viết khuyến nghị: html - bảng viền đơn
không gian vũ trụ
Hồ sơ

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá taxi Didi miễn phí
Phiếu giảm giá taxi Didi
Các bài viết phổ biến trên toàn bộ trang web
Chứng chỉ ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com
Xem sitemap của VNExpress