【问题标题】:Detect element height changes and hide if too small检测元素高度变化,如果太小则隐藏
【发布时间】:2016-04-23 21:30:16
【问题描述】:

我正在使用支付网关小部件,需要检测其高度何时发生变化。为此,我需要定位容器中的第一个 .col-xs-12 并检测其高度是否发生了变化。

如果它的高度发生了变化,那么我需要检查高度是否小于310px

如果是这样,我需要隐藏整行。

我已经尝试了你在下面看到的,但它似乎不起作用。

var $paywhirlWidget = $("#payment-signup-section .container .row .col-xs-12:first-child"),
  lastHeight = $("#payment-signup-section .container .row .col-xs-12:first-child").height();

function checkForChanges() {
  if ($paywhirlWidget.height() != lastHeight) {
    if($paywhirlWidget.height() <= 310) {
        $paywhirlWidget.css("display", "none");
    }
    lastHeight = $paywhirlWidget.height();
  }
}

setTimeout(checkForChanges, 500);

【问题讨论】:

  • 我立即注意到的几件事是您正在使用 setTimeout,它只执行一次。您将寻找函数 setInterval 来继续检查大小是否更新。不过,jquery .resize() 函数可能更有帮助。这将在调整元素大小时触发。我还没有测试过,但这将是我的第一直觉。 api.jquery.com/resize
  • @mhodges setInterval 排序了!好孩子,如果您发布该评论作为答案,我将投票并标记为正确!干杯。

标签: javascript jquery css resize height


【解决方案1】:

根据要求:我立即注意到的几件事是您正在使用 setTimeout,它只执行一次。您将寻找函数 setInterval() 来继续检查大小是否更新。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2015-07-03
    • 2013-04-18
    • 2021-07-03
    • 2013-04-19
    • 2017-04-01
    • 1970-01-01
    • 2016-04-16
    • 2012-07-14
    相关资源
    最近更新 更多