Javascript 使用Jquery的全高但响应宽度的背景图像

我有一个高1400宽1000的背景图像，如果我使用任何全屏背景jquery插件或代码，它将从顶部或底部裁剪，使其适合整个屏幕，但我想要的是一个插件或代码，它将确保背景图像根据浏览器的宽度做出响应，但背景图像的全高应该可以通过滚动条看到。目前它从顶部和底部裁剪高度

如果这是不可能的，至少作物应该只从底部保持纵横比

.background{
  width: 100%;
  height: 100%;
  background-image:url(path/to/image.jpg);
  background-position: top center;
  background-size: cover;
}

这将只裁剪底部，但确保图像“覆盖”整个元素

演示：

要显示100%的高度并裁剪宽度，只需将

背景大小

参数设置为

自动100%

---

演示：

谢谢，但是否可以确保整个高度可见？使用css还是javascript？