纵向缩放 div；保持纵横比

Question

SO：我花了好几个小时来解决这个设计问题，但似乎找不到准确的答案。我正在尝试缩放 div 以适应指定的高度但限制其纵横比。参见示例：http://jsfiddle.net/ks2jH/121/

根据我的研究，讨论已经有点遍布各地，包括here。麻烦的是，div 仅根据浏览器的宽度而不是其高度来调整大小和约束。

我发现的两个最接近的解决方案适用于宽度： (1) 使用 :after 伪类http://jsfiddle.net/ks2jH/89/，或者 (2) 使用空白/透明 png [http://jsfiddle.net/ks2jH/94/].

当然，这个想法是在不指定宽度的情况下实现相同的效果，因为它会根据高度自动调整。

想法？

Answer 1

使用 jQuery 做到了。

http://jsfiddle.net/5TETn/210/

我能够通过Mottie over at GitHub 修改纵横比脚本 [参见：http://jsfiddle.net/Mottie/5TETn/8]，以实现仅靠 CSS 无法实现的功能。非常感谢，好心的先生。