Question

我需要一个允许我这样做的小脚本：

if(// window body Height is less then 660px) {
       // code to be executed if condition is true 
} 

else { 
      // code to be executed if condition is false 
}

希望有一个简单的解决方案！

修改

我现在有这个：

$(document).ready(function(){  

if(parseInt($('body').height())<660){
    $("#container").addClass("small");
}
else{
    $("#container").removeClass("small");
}
 });

但它没有用，有人知道我做错了吗？

Answer 1

if(parseInt($('body').height())<660){

}else{

}

我认为height（）和width（）会返回整数但是更好的解析是肯定的。

如果你不想使用jquery

if(document.getElementsByTagName('body')[0].offsetHeight<660){

}else{

}

应该有用。

Answer 2

你走了：

$( window ).resize(function () {
    $( container ).toggleClass( 'small', $( window ).height() < 660 );
}).triggerHandler( 'resize' );

其中container是对#container元素的引用。

.triggerHandler()将手动触发resize事件（反过来将执行上面的resize处理程序），因此上面的代码适用于重新调整大小和页面加载。

Answer 3

我想我会指出后人的后代。在某些情况下，您可能需要（body）元素的整个高度，而不仅仅是height属性。使用.outerHeight(true)即可。

注意，请打开Firebug / Chrome控制台。

body {
  padding: 10px;
  margin: 25px;
}

<p>This is a test</p>

console.log($('body').height());
console.log($('body').outerHeight(true));

这给了你：

20
90

http://jsfiddle.net/userdude/TS2Nn/

要解决此问题，您可以使用html：

console.log('html: '+$('html').height());
console.log('html: '+$('html').outerHeight(true));
console.log('body: '+$('body').height());
console.log('body: '+$('body').outerHeight(true));

哪个会给你：

html: 90
html: 90
body: 20
body: 90

http://jsfiddle.net/userdude/TS2Nn/2/

识别身体的宽度和高度

3 个答案: