0

这是CSS Display an Image Resized and Cropped的延续。该用户的答案似乎没问题，但我需要一些帮助来改进该答案......

问：resize（缩放）如何与运行时图像的大小相关联。即我不想硬编码像“宽度：320px；高度：221px；” 在样式中 - 如果您预先知道图像的尺寸，则可以使用。

这里有一些jsfiddles：

http://jsfiddle.net/VdX68/ - 基于原始线程答案。如果您预先知道图像的尺寸，则可以使用。

http://jsfiddle.net/VdX68/4/ - 您不必知道图像的尺寸，但仅适用于 100% 的比例。（这里我只是从 .scalePan 类中删除了宽度，高度。

http://jsfiddle.net/VdX68/2/ - 使用宽度和高度作为百分比。这会将图像缩放到包含 div 的大小，而不是图像原始尺寸。

我正在寻找一种方法将图像缩放到原始尺寸的 %，而不是它所在容器的 %。

非常感谢任何帮助。

4

1 回答 1

-1

我知道你想这样做，但我不完全确定。

$(document).ready(function() {
    var wdth = $('img').width();
    var hght = $('img').height();

    $('img').css('width',  wdth / 100 * 90 + "px"); // new width is 90% width of image
    $('img').css('height', hght / 100 * 70 + "px"); // new height 70% height of image
});

工作示例：http: //jsfiddle.net/VdX68/18/

您不必使用 JQuery，也可以使用常规 javascript 来执行此操作。

于 2012-06-22T12:16:43.010 回答