以％爲單位設置基於瀏覽器窗口寬度的div像素高度（jQuery或JS？）

我試圖在網頁周圍設置黑色邊框。對於左側和右側，製作「寬度：5％;」在CSS是好的。但是，我想要JS/jQuery來計算出有多少像素，並使頂部和底部div的高度。以％爲單位設置基於瀏覽器窗口寬度的div像素高度（jQuery或JS？）

這可能嗎？

謝謝。

2013-06-06 mattnham

請向我們顯示您的代碼。 –

頂部和底部* DIV *或頂部和底部*邊界*？ –

這應該爲你工作

var val = $(".leftAndRight").width(); 
$(".topAndBottom").height(val);

或用一條線：

$(".topAndBottom").height($(".leftAndRight").width());

來源

2013-06-06 10:12:29 mMoovs

效果很好 - 謝謝！ – mattnham

我是新來這個網站，我不知道如何一切工作，但我相信，如果這個答案是適合你的，你可以把它標記爲接受:)我會很感激。 – mMoovs

是的，@ user2451586，這是真的，您可以接受您最能回答您問題的答案，無論是這一個還是其中一個。 ;） –

您可以使用.width（）來查找沒有邊框和.outerWidth的寬度，以找到包含邊框的寬度。我認爲.outerWidth也給你的填充寬度，你可能必須減去它。

來源

2013-06-06 10:07:47 Arun

可以以編程方式確定邊框寬度值，將其分配到所有四個邊框，並且還刷新任何時候你調整：

var width, 
    drawBorder = function() { 
     var body = $('body'), 
      width = body.width() * 0.05; 
     body.css('border-width', width + 'px'); 
    }; 

drawBorder(); 

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

Demo

如果您在樣式表中設置左右寬度，然後使用JS爲頂部和底部指定相同的邊框寬度，除非使用調整大小功能，否則每次調整大小時左右邊框都會更改，但是您的頂部和底部邊界將保持不變。

來源

2013-06-06 11:51:14

以％爲單位設置基於瀏覽器窗口寬度的div像素高度（jQuery或JS？）

回答

相關問題