Image is 1px high

[Peter Knight]

Hi guys. Another image question :-/

I'm using the lazy sizes script which allows for loading of a low-res image before the lazy loaded image kicks in.

It's just a case of specifying the img src as the low quality image.

The code below works but generates an image 1 pixel high. 

I can't see where / how the 1px height is being generated as I'm not specifying any 1px high parameter

 

// Make a very low res version
$options = array(
'quality' => 5,
);
							
echo "
<img
src='{$port_item->images->first()->size(414,$options)->url}'
class='lazyload portfolio-thumb uk-overlay-scale' 

data-srcset='
{$port_item->images->first()->width(750)->url} 750w,
{$port_item->images->first()->width(414)->url} 414w,
{$port_item->images->first()->width(320)->url} 320w'
										
data-sizes='407px'
alt=\"{$port_item->images->first()->description}\" 
>

Resulting HTML

<img src="/site/assets/files/1211/myphoto.414x1.jpg" 

If I remove the $options array, I get a proportional image

<img src="/site/assets/files/1211/myphoto.414x0.jpg" 

Even though the above seems as if the height should be 0, the image is correctly scaled

 

Cheers

 

 

[Robin S]

40 minutes ago, Peter Knight said:

src='{$port_item->images->first()->size(414,$options)->url}'

The first two arguments to the size() method are expected to be integers, so your $options array is being cast to an integer.

Maybe you intended:

src='{$port_item->images->first()->width(414,$options)->url}'

 

[Peter Knight]

That's it @Robin S. Thanks.

I previously had a width and height specified and when I removed the height I had forgotten to change 'size' to 'width'.