I am working on a gallery page laying the images out using Fleximage.js and am having a hard time pulling in the image dimensions as data points for the script to use.
Below is my code for fetching the images. They need to have height and width data points for the script. Currently the is applying the first images dimensions to all the images retrieved.
Any thoughts?
<div class="flex-images my-gallery">
<?php foreach($page->images()->sortBy('sort', 'asc') as $image): ?>
<div class="item" data-w="<?php echo $page->image()->width() ?>" data-h="<?php echo $page->image()->height() ?>">
<img src="<?= $image->url() ?>" alt="<?= $page->title()->html() ?>"/>
</div>
<?php endforeach ?>
</div>