0

我正在根据当前视口大小调整 JavaScript 中的图像大小。没有媒体查询和其他类似的东西，一直是 JS，也没有元素的静态大小。

所以基本上它看起来像这样：

    var computedHeight = viewport.height * someRatio;
    var image = goog.dom.createDom('img', {
        'src': 'the.link.to.the.image',
        'height': computedHeight + 'px',
        'width': 'auto'
    };
4

3 回答 3

2

正如其他人所说，在将图像插入文档之前，您无法获得尺寸。

但是你可以自己计算大小。

加载图像后，您可以访问图像的原始大小。基于此，计算缩放大小并不是很困难：

    var image = goog.dom.createDom('img', {
    'src': 'the.link.to.the.image',
    'height': computedHeight + 'px',
    'width': 'auto',
    'onload':function(){
      alert('width:'+
            Math.floor((this.naturalWidth*this.height)/this.naturalHeight)+
            '\nheight:'+this.height);        
    }
});
于 2012-11-14T20:17:00.087 回答
1

显示图像后，尝试查询以下属性

image.offsetWidth
image.offsetHeight
于 2012-11-14T19:18:30.143 回答
1

试试 goog.style.getComputedStyle(image, 'width')。可能您需要先将其添加到文档中。

于 2012-11-14T19:20:41.023 回答