jquery之当背景覆盖自动缩放时，如何获取缩放图像的比例

我有一些问题:

我需要将一些文本绑定(bind)到图像的位置(你知道，就像 redpen.io 和其他服务上的标记)。文本绑定(bind)到大图像，例如 1900x1200px。

然后在其他页面上，我将此图像添加到元素的背景，拉伸(stretch)到所有窗口:

#backg { 
    width: 100%; 
    height: 100%; 
    background-image: 'url-to-big-image.jpg' 
    background-repeat: no-repeat; 
    background-size: cover; 
} 

然后我遇到了麻烦:我无法将我保存的标记绑定(bind)到这个元素! 首先，我将元素的原始高度和宽度除以窗口高度和宽度:Qh 和 Qw。 我采用标记的原始 top 和 left css，然后乘以 top*Qh 和 Qw*left。

它适用于宽度，但不适用于高度!它以某种方式由浏览器缩放，并且图像上元素的位置不匹配。

如何获得高度缩放比例来定位我的标记？

提前致谢!

请您参考如下方法:

这么少的代码很难帮助你。

我尝试通过更改以下 CSS 行来提供简单的改进:

#backg { 
    background-size: 100% 100%; 
    position: relative; 
} 

您可以在 this jsfiddle 上玩它.

这是你要找的吗？

[更新]

您可以使用 padding-top 技巧来获得适合图像大小的容器。

#backg { 
    height: 0; 
    padding-top: <image-ratio>%; 
} 

您可以在 this updated jsfiddle 上玩它。

干杯， 托马斯。