• Registered: 2015-03-15
  • Posts: 2

Topic: Scaling images

Hello. I have setup Juicebox pro to show some images. I tried height and width 100%(responsive) and also set the dimensions of Juicebox pro but it does not scale the images. I have tried all options in Main Image->Image Scale Mode but it crops the image instead of scaling it. I also checked the xml file and could not find any scaling option been passed. How can I manually do this as I think the option is not been passed and is stuck to default..

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Scaling images

The imageScaleMode values will change how the image is scaled within the gallery's image area.
Images will not be cropped if imageScaleMode is set to either SCALE or SCALE_DOWN.

However, imageScaleMode will not affect the responsiveness of the gallery itself.
If you want the gallery's size (and therefore the image area within the gallery, too) to resize with the size and shape of the user's browser window, then you could either:
(1) Set your gallery's dimensions to be percentages (rather than fixed pixel values) and ensure that all your gallery's parent containers also have percentage dimensions. If there is any fixed pixel value anywhere up the chain, then the gallery's size will become fixed, e.g. 100% x 100% x 800px = 800px.
(2) Use JavaScript to listen for a change in the size of the user's browser window, determine new dimensions for the gallery and assign them to the gallery's container. There are examples of this technique in the Using a Resizable Gallery with a Header support section. You could view the source of the sample web pages in your browser and copy or modify the code as required.

I hope this helps.