Javascript库强制HTML元素的纵横比？

Question

是否有任何 Javascript 库可以强制 HTML 节点（主要是图像和 div）在调整大小时保持其纵横比？

当元素的宽度受窗口大小限制时，这对于调整元素的高度特别有用。

注意：如果可以在纯 CSS 中完成，我买它！

Answer 1

你的意思是这样的？

http://jsfiddle.net/DerekL/J2s3C/

代码如下：

img{
    width: 100%;
    height: auto;
}

对于其他元素，这将是一个位更复杂。

这里是第二个演示：http://jsfiddle.net/DerekL/5BgXk/：

<div id="wrapper"><div id="content"></div></div>

#wrapper {
    position: relative;
    padding-bottom: 33.33%; /* Set ratio here */
    height: 0;
}
#content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: green;    
}