1

I want to get the screen and modify the css styles of my box. Thats my code

if ($('.content').height() > $(window).height() - 100) {
    $('.content').css("max-height", $(window).height() - 100);
}

Now I want to set the max height of the .content box lower than the height of my screen size. If my content box is higher than my screen size, the css should set de max height and change the overflow to auto.

4

4 回答 4

2

看起来你可以这样做 -

var content = $(".content");
// Cache the height in variables, no need to access DOM again and again
var screenHeight = $(window).height();
var contentHeight = content.height();
if(contentHeight>windowHeight-100){
  content.css("overflow","auto"); // Note - this will change it for the current instance of the page and NOT in your CSS file
  content.css("max-height",(windowHeight-100) + "px");      
}

也可以将以上两个css属性组合在一个语句中（单独写出来解释）——

content.css({"max-height":(windowHeight-100)+"px","overflow":"auto"});
于 2013-10-17T14:35:29.390 回答
1

我建议您将最大高度值与px.

if ( $('.content').height() > ($(window).height() - 100) ) {
    $('.content').css("max-height", ( $(window).height() - 100 ) + "px" )
                 .css("overflow","auto");
}

这将解决您的问题。

于 2013-10-17T14:36:10.377 回答
0

做这个 -

var maxHeight = $(window).height() - 100;
if ($('.content').height() > maxHeight) {
    $('.content').css({"max-height": maxHeight, overflow: "auto"});
}
于 2013-10-17T14:29:02.890 回答
0

使用单位“px”

 $('.content').css("max-height", ($(window).height() - 100)+"px");
于 2013-10-17T14:33:54.317 回答