如何通過JQuery修改CSS

我想獲取屏幕並修改我的盒子的CSS樣式。這就是我的代碼如何通過JQuery修改CSS

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

現在我想設置的。內容盒子比我的屏幕尺寸的高度低的最大高度。如果我的內容框高於我的屏幕大小，css應設置de max height並將溢出更改爲auto。

來源

2013-10-17 Chrisser Madethis

[This]（http://stackoverflow.com/questions/838137/jquery-change-height-based-on-browser-size-resize）可能會幫助你交配... –

你遇到的任何錯誤？ – Vandesh

沒有錯誤。例如我的屏幕尺寸是924px，我的內容看起來更高，並且不在屏幕上，但是它只有608px的高度 –

看起來你可以做到這一點 -

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-17 14:35:29 Vandesh

做到這一點 -

var maxHeight = $(window).height() - 100; 
if ($('.content').height() > maxHeight) { 
    $('.content').css({"max-height": maxHeight, overflow: "auto"}); 
}

來源

2013-10-17 14:29:02 Bikas

嗯，我已經看到，jquery什麼也沒有寫入到html –

使用單位「像素」

$('.content').css("max-height", ($(window).height() - 100)+"px");

來源

2013-10-17 14:33:54 user2886352

啊現在它適用於單位「px」;）THX！ –

我建議您使用最大高度值以及px。

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

這會解決你的問題。

來源

2013-10-17 14:36:10

如何通過JQuery修改CSS

回答

相關問題