Javascript 使用CSS背景尺寸：封面时获取背景图像的新高度？

我用的是

背景尺寸：封面在CSS中，虽然它工作得很好，但我注意到，一旦它“启动”，您可能会遇到背景图像的整个
高度不显示的问题

例如，我有如下代码：

#home .top {
    min-height: 768px;
    background: #fff url('../images/home-bg-lg.jpg') center top no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

现在，
min高度：768px
指的是图像的实际高度，所以我设置它以确保无论内容如何，它始终显示完整高度；然而，很明显，一旦背景尺寸开始增加，
高度
也会增加，因此
768px
尺寸不再足够大，很多背景都没有显示出来

有没有办法用
CSS
解决这个问题，如果没有，用
JavaScript
，最好是
jQuery

如果只是一个JavaScript/jQuery解决方案，可能值得一提的是，我使用
断点
，并以较小的分辨率使用较小的背景图像；不需要对这些应用任何东西

编辑：为了澄清这一点，我想知道它是否有可能在展开时始终显示图像的完整高度。因此，例如，如果它使用的图像是
1600 x 768
，并且有人以
1920 x 900
分辨率查看它，那么它将扩展到
1920px
宽度，因此如果
min height
可以更改为
922px
，这将是它现在的正确高度，这将是很好的图像是一个背景，那么它只是一个“装饰”，所以它是否有一点起伏并不重要。如果您的图像很重要，那么它是页面“内容”的一部分，那么您应该使用标签来放置它。这样它就自动生成了。
如果仍要将图像显示为背景，则无法获得渲染高度，因此必须执行一些javascript计算：

创建图像对象以获取bg图像的宽度和高度：

var高度、宽度、比例；
var img=新图像（）；
img.src=imageurl；
img.onload=函数（）{
高度=img.高度；
宽度=img.width；
比例=宽度/高度；
}

然后，您可以将图像的比例与容器的比例进行比较，以查看它是更垂直还是更水平

如果它更垂直，那么它是交叉两边，如果它更水平，它是交叉顶部和底部
当您知道这一点时，您可以更改容器的大小以适应图像的比例
编辑：我个人的观点是，用js做这件事有点混乱。在大多数情况下，最好使用标签或忘记那些交叉部分。如果您认为图像的一个重要部分没有显示，也许您可以稍微调整一下背景位置，以确保始终显示图像的焦点。
如果没有，我假设您有背景的原始尺寸

嘿，布雷特，你能澄清一下你想要它做什么吗？我在这里拉了把小提琴。图像以exands填充整个分区（屏幕）。这是你想要的吗？你想始终显示全高并在左/右上有白色边框吗？你想始终看到整个背景图像而不考虑纵横比吗？@MartinGottweis我编辑了我的问题以澄清。@Samurai请查看编辑。哦，我现在不确定我是否理解了。你有这个问题的演示网站吗？设置为cover的背景大小将扩展图像以填充div。另一个选项是拉伸图像，这听起来不太可能。我正在考虑相同的方法+1飞行点。我的意思是，如果其中一些没有显示出来，这不是一个大问题，但我想这将是理想的。不能真正使用标签，因为内容显示在它上面，也不想使用绝对定位来放置内容，如果我这样做，背景也不会水平扩展。这难道不会在任何断点处控制背景并影响较小的背景，而不是在背景变大后立即启动吗我怀疑，任何小于最小高度的高度都不会有任何影响。您可以在最后一行之前添加任何条件。例如
if（elw>bgw）
。如果在不考虑大小变化的情况下保持纵横比，那么如果容器的宽度较小，高度部分将不可见，则会出现相同的问题。但我可能没有正确理解这个问题。
var bgw = 1600;
var bgh = 768;

function coverBg() {
    var el = $('#home .top');
    var elw = el.outerWidth();
    var elh = el.outerHeight();
    var newHeight = elw*bgh/bgw;
    el.css('height', newHeight);
}