Your Cart

Fit to height – can’t get percentage height to work

These forums are now closed to new replies / tickets.

Please open a support ticket from our new Support page.

Front Page Forums Problems Fit to height – can’t get percentage height to work

  • gravatar
    Simon
    August 6, 2015 at 5:21 pm

    I’ve seen variations on this problem before, but so far no
    solution, at least not one that applies to me. Here goes…

    My basic problem is that I’m trying to make the gallery fill as
    much screen space as is available. Where this gets tricky is for a
    tall and narrow window (i.e. a mobile phone screen). The height
    needs to be a percentage of the window height for the gallery to
    fit the height. However the property height doesn’t seem to accept
    percentages. Is this simply not supported, or is something else
    wrong?

    In other words: How do I make the gallery fill as much vertical
    space as is available? The “ratio” option set to a value that makes
    sense in a wide window (around .5) yields a tiny gallery in a tall
    and narrow window (see screenshots).

    Worst case scenario I would be open to a JS workaround triggered
    by resize events if that makes sense. What I’ve tried so far
    doesn’t work.

    I tried triggering the following when window height is greater
    than window width:
    Galleria.configure(‘height’, .9);

    I also tried dynamically changing the css height of the gallery
    to a percentage (when height > width):
    $(‘.galleria’).css( ‘height’, (.9 * wHeight).toString() + ‘px’
    );

    The gallery doesn’t seem to react to either.

    I’m using version 1.4.2 and the classic theme.

    Attachments:
    1. Screen_shot_2015-08-06_at_11.45.22


    gravatar
    Simon
    August 6, 2015 at 5:24 pm

    Second screenshot didn’t attach for some reason. Here is what
    happens in a tall, narrow window when using a ratio height.

    Attachments:
    1. Screen_shot_2015-08-06_at_12.22.44


Galleria.io uses cookies to store information. You can read more about that in our Privacy Policy. I understand