我在我的网站上使用引导灯箱实现。为了使灯箱发挥最佳效果，我需要提供灯箱中显示的每张图片的实际高度和宽度。我正在寻找一种动态提供此数据的方法，而不必对每张图片进行编码。我知道您可以使用 javascript 获取数据，但我知道您不能在 HTML 中使用变量。是否有一些解决方法，也许使用 CSS 变量？
例如(显然这行不通)我如何传递这个数据大小？
<body>
<figure class="col-md-4">
<a href="p1.jpg" data-size=var(imgSize)>
<img src="p1.jpg" class="img-fluid">
</a>
</figure>
<script>
var img = new Image();
var imgSize = this.width + 'x' + this.height;
img.src = 'p1.jpg';
</script>
</body>
最佳答案
尝试将您的动态数据包装在一个函数中并在您的属性中调用它
<body>
<figure class="col-md-4">
<a href="p1.jpg" data-size=imgSize()>
<img src="p1.jpg" class="img-fluid">
</a>
</figure>
<script>
var img = new Image();
var imgSize = functions() { this.width + 'x' + this.height};
img.src = 'p1.jpg';
</script>
</body>
关于javascript - 如何将图片高度和宽度传递给 html 灯箱，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57677653/