如果元素大小小于 X，则

Question

如果高度小于 700px，我想更改元素的属性。所以我尝试了这段代码：

if ($('.content').height() < 700) {
    $( "#footer" ).css( "position", "absolute" ); 
};

不幸的是，它不起作用。我在哪里犯错？谢谢。

Answer 1

尝试使用：.style.height

内高：document.getElementById("id").clientHeight

外部高度：document.getElementById("id").offsetHeight

Answer 2

试一试 :)

outerHeight - http://api.jquery.com/outerheight/

$(document).ready(function(){    
        var contentHeight = $('.content').outerHeight();    
        if ( contentHeight < 700) {    
            $( "#footer" ).css( "position", "absolute" );    
        };
    });

Answer 3

代码正确。您只需要检查条件是否为真。您可以使用 console.log("it works") 或 alert("it is true").

检查它

我相信您想在某些事件后更改属性。

$("btn").on("click", function(){

   //to check if event is fired or not
   alert("clicked");
   //if you want to check your condition in console
   console.log($('.content').height() < 700)

  if ($('.content').height() < 700) {
     $( "#footer" ).css( "position", "absolute" );
  }

});

Answer 4

当我尝试上面提供的示例时，它工作正常。

我需要更多关于你想要实现的目标的详细信息。

据我所知，如果我没记错的话，您想根据页面加载时的内容高度和页面调整大小来添加和删除绝对位置。如果是这种情况，请尝试以下代码。

function handleFooter () {
  if ($('.content').height() < 250) {
    $( "#footer" ).css( "position", "absolute" );
  } else {
    $( "#footer" ).css( "position", "static" );
  }
}

handleFooter();

$(window).resize(function() {
  handleFooter();
});

如果这不能解决您的问题，请提供更多信息或额外的代码片段，以便我更好地帮助您

如果元素大小小于 X，则

If element size is smaller than X, then

css

jquery

height