I am new to using Umbraco's Image Cropper and have a question
regarding the GetCropUrl and GetResponsiveImageUrl menthods.
I'm required to display hero images, which are fairly long in
desktop view. My issue is that when I adjust the the width of the window
down to tablet/mobile view, Slimsy/Slimmage maintains the ratio aspect of the
image (whilst cleverly switching the image sizes to reduce load), however as
the hero image's aspect ratio would not suit a mobile device given their quite
long and thin. Ideally, I would like to maintain the height of the image when
resizing the window, but have slimmage maintain the focal point set in Umbraco
when adjusting the width. Having gone through most (if not all!) of the
tutorials, I thought this would be possible by using a fixed width and height
parameter with the GetCropUrl method and omitting
ratioMode: ImageCropRatioMode.Height value. Or, define both width
and height if I was using the SLimsy method GetResponsiveImageUrl (and not
setting height to zero to maintain aspect ratio)
I'm not sure if I'm missing something or some simple CSS would do the trick but any help would be much appreciated.
I hope this makes sense! Alternatively, another solution would
be able to switch crop alias at various breakpoints if at all possible.
Maintain fixed height when adjusting window size
Hi there
I am new to using Umbraco's Image Cropper and have a question regarding the GetCropUrl and GetResponsiveImageUrl menthods.
I'm required to display hero images, which are fairly long in desktop view. My issue is that when I adjust the the width of the window down to tablet/mobile view, Slimsy/Slimmage maintains the ratio aspect of the image (whilst cleverly switching the image sizes to reduce load), however as the hero image's aspect ratio would not suit a mobile device given their quite long and thin. Ideally, I would like to maintain the height of the image when resizing the window, but have slimmage maintain the focal point set in Umbraco when adjusting the width. Having gone through most (if not all!) of the tutorials, I thought this would be possible by using a fixed width and height parameter with the GetCropUrl method and omitting ratioMode: ImageCropRatioMode.Height value. Or, define both width and height if I was using the SLimsy method GetResponsiveImageUrl (and not setting height to zero to maintain aspect ratio)
I'm not sure if I'm missing something or some simple CSS would do the trick but any help would be much appreciated.
I hope this makes sense! Alternatively, another solution would be able to switch crop alias at various breakpoints if at all possible.
Thanks in advance!
Hoang
is working on a reply...