Image Transforms not stretching image

Question

i´m implementing a image gallery and want to show the thumbnails ( no problem here ) with a transform applied, and i want to implement a image transform on the large image that opens on a lightbox. Why? because it´s a responsive website, and the load speed is crucial, and don´t want to slow things down loading the full image uploaded directly from the client camera ( 6mp or more ), i want to load a large image with a max width of 1000px and jpg quality of 70. I applied the transform and works fine, but the images below 1000px are streted to fit 1000px.

So, my question is: how to set max width of an image to 1000px BUT not forcing it if it´s smaller than the required size?

Crop Fit and Scales don´t do the job.

Any help is welcome! Thanks.

Answer 1

Before you run your transform, you can check the width of the asset file and adjust your transform as needed.

{% set thumb = {
    mode: 'scale',
    width: 1000,
    quality: 70,
} %}

{% if asset.width < 1000 %}

    {% set thumb = {
        mode: 'scale',
        width: asset.width,
        quality: 70,
    } %}

{% endif %}