如何在瀏覽器調整大小時正確調整div大小？

假設我有以下表格：如何在瀏覽器調整大小時正確調整div大小？

<div style="padding:10px"> 
<table style="width:100%"> 
<tr><td style="width:10%">Jordan Roger</td><td style="width:100%"><div width="200px" style="background:red"></div></td></tr> 
</table> 
</div>

我怎樣可以用JavaScript使它使得200像素的div永遠填補空間到屏幕的右側（紀念10px的填充）每當瀏覽器是調整大小？（高度可以保持不變，寬度優先

注意：百分比不是div的選項，通常我會使用百分比，但這不是一個選項，因爲我只能設置div的寬度到px的特定值，而不是以「thediv.setSize（width，height）」的百分比表示。

如果可能，我在考慮以下內容作爲這樣做的潛在方式，但不知道如何正確使用它作爲爲200px股利是不會被佔用瀏覽器的整體高度和寬度，因爲它坐落在一個表中。

$(window).resize(function() 
{  
    mydiv.setSize($(document).width(), $(document).height())); 
});

如果有一些「正確」的方式，我應該用這個...

來源

2013-02-28 Rolando

爲什麼不是百分比的選項？ – jchapa 2013-02-28 06:19:51

百分比不是一個選項，因爲我使用的某個插件使用div，需要手動指定您使用的div的寬度和高度。調整大小時，有一個setSize函數，可以手動指定寬度和高度來更改它。但你不能只說setSize（「100％」，「100％」）。因此，如果可能的話，用戶調整大小時的像素必須以某種方式計算。 – Rolando 2013-02-28 06:23:19

更新的問題與潛在的解決方案 – jchapa 2013-02-28 06:27:28

你將不得不使用寬度百分比 - 即「相對」寬度。

編輯以反映變化的要求。

爲什麼不用這樣的JS來設置樣式？ How to set width of a div in percent in JavaScript?

或者，你也許可以綁定一個監聽器：http://api.jquery.com/resize/，用來檢查頁面的寬度，並調用該函數的setSize

來源

2013-02-28 06:18:18 jchapa

是的，這是我試圖使用，雖然它似乎總是搞砸了。它的「我將如何設置功能，這是困擾我」。有什麼我需要做的，以獲得TD容器寬度找出實際放置setSize函數？還是有一些其他的算法來找出什麼會進入setSize？這是問題的關鍵。 – Rolando 2013-02-28 06:33:44

如何在瀏覽器調整大小時正確調整div大小？

回答

相關問題