防止响应图像跳转？

Question

我正在使用图片元素与srcset因此，根据设备屏幕大小下载具有不同分辨率的相同图像。

这是最大宽度：100％对图像的样式，所以当它下载它迫使下面的内容移动。

有没有什么办法可以告诉浏览器在使用srcset时使用CSS保留空间？

如果不可能，我也对JavaScript的答案感兴趣。

谢谢。

Answer 1

您可以根据图像宽度设置图像高度。所以你唯一需要知道的是你的相机长宽比。如果图像有不同的比例，我们有问题...

ratio=9/16; 
window.onload=window.onresize=function(){ 
    Array.prototype.forEach.call(document.getElementsByTagName("img"),function(img){ 
     img.height=img.width*ratio; 
    }); 
};