Javascript 响应地将div高度调整为背景图像高度

我有一个图像博客，我想禁用简单的右键点击图像下载。为此，我将图像设置为div元素的背景

我的网站是有响应性的，我在div元素中添加了

背景大小：contain

，因此如果它们被调整大小，背景图像将采用宽度

问题是，我不知道如何使div高度适应背景图像的高度，因此在调整图像大小时，图像下没有很大的空间

是否可以使用jQuery等实现

尝试在此处缩小div：

.ui可调整大小的帮助器{
边框：2个点#00F；
}
.可调整大小{
背景：url（'http://www.ancestry.com/wiki/images/archive/a/a9/20100708215937！Example.jpg'）不重复；
背景尺寸：包含；
宽度：400px；
高度：267px；
边框：2倍纯色灰色；
}

$（函数（）{
$（“.resizable”）.resizable({
动画：对，
});
});

防止右键单击图像下载的CSS方法之一是在图像上设置

指针事件：none

。这样，通过将图像作为div的一部分，可以通过图像的高度控制div的高度，同时防止单击事件

img {
    pointer-events: none;
}

另一种仅限于CSS的方法是在图像顶部放置一个不可见的屏幕，以捕获点击事件：

---

你不能用CSS将div的大小调整为bg图像的大小-是的，这就是为什么我想知道是否可以用javascript。感谢你的帮助，使用指针事件解决方案，图像甚至不必是背景。你知道了。对于较旧的浏览器，您可以使用使用伪元素的“屏幕”解决方案，或者对于真正较旧的浏览器，您可以使用标记。

.imageHolder:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
}