1

希望你能帮助我。

我在论坛上搜索过，我猜这个是一个特例。

我正在构建的项目由媒体查询（响应式）提供支持，我有 3 列，有时需要 4 列处于相等的高度。我在 Jquery 中开发了一个脚本，效果很好。见下文

var maxHeight = 0;
function setHeight(column) {
    $(window).load(function () {
        column = $(column);
        column.each(function () {
            if ($(this).height() > maxHeight) {
                maxHeight = $(this).height();
            }
        });

        column.height(maxHeight);
    });
}

setHeight('.package-container .package-3');

但是当我要移动版本时，低于 767px，我如何在不刷新页面的情况下销毁这个setHeight()函数。

其他替代方法，我可以在下面使用 enquire.js、javascript 媒体查询来执行此操作，但如果我直接从桌面/平板电脑转到移动设备，则无需刷新就无法使其工作。像下面这样

enquire.register("(max-width:767px)", {
    match : function() {
        setHeight(null);
    }
}).listen();
4

1 回答 1

2

这是我在移动优先方法中要做的事情，您无需担心“破坏”任何简单地将高度设置为自动的东西：

enquire.register("screen and (min-width : 768px)", {
    match : function() {
        // set equal height for columns
        setHeight('.package-container .package-3');
    },
    unmatch : function() {
        // set auto height
        $('.package-container .package-3').height("auto");
    }
}).listen();
于 2013-04-06T10:05:01.503 回答