javascript - 使用 jQuery 保持图像高度的比例

Question

嘿，我正在尝试自动获取图像的高度。我似乎找不到任何 jQuery 来做到这一点？

我想要做的就像它在 Photoshop 中所做的那样：

如果图像是：

Width  = 778
Height = 346

我想将宽度更改为380 ，然后在 Photoshop 的宽度文本框中输入 380将高度更改为169：

width  = 380
height = 169

我如何在 Jquery 中模仿这个？

Answer 1

这样的事情怎么样

http://jsfiddle.net/Njf5k/1/

HTML

<label>Original Width</label>
<input type="text" id="originalWidth" class="original" value="778" />
<br />
<label>Original Height</label>
<input type="text" id="originalHeight" class="original" value="346" />
<label>New Width</label>
<input type="text" id="newWidth" class="new" />
<br />
<label>New Height</label>
<input type="text" id="newHeight" class="new" />

jQuery

它基于宽度/高度保持不变的事实。

$('#newWidth').keyup(function () {
    $('#newHeight').val(Math.round(
    ($('#originalHeight').val() * $('#newWidth').val()) / $('#originalWidth').val()));
});

Answer 2

你为什么需要这个？如果您只是在 html img 元素中设置了一个像高度/宽度这样的属性，您会自动按比例查看图像。