javascript - 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;    
}