Я использую этот код на своей веб-странице. Я использую атрибут Data-size для поддержания соотношения сторон изображения во всплывающем окне.
<figure>
<a href="img/large-image/1.jpg" itemprop="contentUrl" data-size="1024x1024">
<img src="img/small-thumbnail/1.jpg" itemprop="thumbnail" alt="Image description" />
</a>
<figcaption itemprop="caption description">Image caption 1</figcaption>
</figure>
<figure>
<a href="img/large-image/2.jpg" itemprop="contentUrl" data-size="964x1024">
<img src="img/small-thumbnail/2.jpg" itemprop="thumbnail" alt="Image description" />
</a>
<figcaption itemprop="caption description">Image caption 2</figcaption>
</figure>
<figure>
<a href="img/large-image/3.jpg" data-size="683x683">
<img src="img/small-thumbnail/3.jpg" itemprop="thumbnail" alt="Image description" />
</a>
<figcaption itemprop="caption description">Image caption 3</figcaption>
</figure>
Теперь я не могу каждый раз вводить размеры изображения вручную. Итак, как я могу автоматически поместить значение ширины и высоты изображения в атрибут «data-size»?
getimagesize()
можно использовать для получения размеров изображения:
<?php
list($width, $height) = getimagesize("img/large-image/1.jpg");
?>
<a href="img/large-image/1.jpg" itemprop="contentUrl" data-size="<?php echo $width . 'x' . $height; ?>">
Других решений пока нет …