I have set up fancybox 3 for my photography portfolio, and it stretches the image to the width as seen in the image.
My problematic page.
There are 4 images on this page, 2 vertical ones that have been stretched and two landscape ones that are fine.
<?php
// Include database configuration file
mysqli_report(MYSQLI_REPORT_ERROR | MYSQLI_REPORT_STRICT);
// Retrieve images from the database
$query = $DB->query("SELECT * FROM images ORDER BY uploaded_date DESC");
if(!$query) {
trigger_error("Invalid query: " . $DB->error);
}
if($query->num_rows > 0){
while($row = $query->fetch_assoc()){
$imageURL = '../phpgallery/'.$row["path"];
?>
<a href="<?php echo $imageURL; ?>" data-fancybox="gallery" data-caption="<?php echo $row["title"]; ?>">
<img src="<?php echo $imageURL; ?>" alt="" width="300"/>
</a>
<?php }
} ?>
That is the code I have. The slideshow aspect works fine. I didn’t do the method of using 2 files, large and small because I am uploading with PHP to a MySQL server and I don’t know how to copy and resize images.