Question

我正在尝试建立一个有广场网格的响应式网站。所以我需要每个div的高度（使用'main'类）与调整大小时的div宽度相同。我对jQuery很新，所以我希望有人可以告诉我这里我做错了什么。

var divWidth = $('.main').width(); 

$(window).resize(function(){
    $('.main').height() = divWidth;
});

非常感谢！

Answer 1

您不应在resize（）函数范围之外声明divWidth，因为在触发resize事件时不会更新该值。此外，存在多个.main元素的风险。要么使用ID，要么遍历所有类（如果有多个实例）。

试试这个：

$(window).resize(function(){
    // If there are multiple elements with the same class, "main"
    $('.main').each(function() {
        $(this).height($(this).width());
    });

    // Or you can switch to using an ID
    $('#main').height($('#main').width());
}).resize();

再次触发resize（）事件以确保在加载时设置大小。

Answer 2

你可以这样做：

var divWidth = $('.main').width(); 

$(window).resize(function(){
    $('.main').height(divWidth);
});

Answer 3

尝试

var divWidth = $('.main').width(); 

$(window).resize(function(){
    $('.main').height(divWidth);
});

Answer 4

试试这个：

var divWidth = $('.main').width(); 

$(window).resize(function(){
    $('.main').height( divWidth );
});

请注意，height()在没有参数的情况下调用时会给你高度，但是使用参数，它会改变对象的高度;）

jQuery - 设置div高度等于div宽度

4 个答案: