如何在浏览器调整大小时正确调整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大小？

回答

相关问题