javascript - 在调整大小时更改元素的高度

Question

大家好，我正在尝试动态更改元素的高度。 这些是我的变量。

var windowWidth = 1440;
var currentWidth = $(window).width();
var elementHeight = $('#line4').height();

现在我想要的是当窗口宽度和当前宽度之间的差异小于 6 时，我想更改元素的高度。每当 (windowWidth - currentWidth)<6 时，我都想这样做。因此，每次当窗口调整大小时，它低于 6，我想将元素的高度更改为负 14px。这是我试过的。

$( window ).bind("resize", function(){
    if((windowWidth - currentWidth)<6) {
        $("#line4").css('height', elementHeight-14);
    }
});

它不起作用，我不知道我错过了什么。另外跟进问题我可以通过这种方式更改其他 CSS 属性吗？对于这个特殊问题，我还需要以相同的方式更改 css top 属性，因为我有一些具有绝对位置的 div。

Answer 1

您需要在每次调整大小事件时测量窗口的当前宽度，因为它也在变化。

var windowWidth = 1440;
var currentWidth = $(window).width();
var elementHeight = $('#line4').height();

$( window ).bind("resize", function(){
  currentWidth = $(window).width()
  if((windowWidth - currentWidth)<6) {
    $("#line4").css('height', elementHeight-14);
  }
});