Highslide JS - Is there a way to have expanded images share a common center?

Question

I'm using Highslide JS with gallery, using a single thumbnail to launch the gallery. After expanding the image, when advancing through the expanded gallery, all of the images appear to be anchored at the bottom, meaning, when you switch from a landscape (long-side horizontal) image to a portrait (long-side vertical) image, the bottom edge of the image will stay in one place, and the remainder of the image will expand upwards. This doesn't work too badly, except if when you go from a portrait image to a landscape image, the new image is sitting at the bottom of the viewport. Is there any way to have all of the images share a common center, and expand from there, instead of sharing a common bottom edge? That way they won't be constantly moving up and down in the viewport. If I want to use a thumbstrip, I can't place it on the top or bottom since it can/will get covered up by an image at times. All of the expanded images I'm using are 800x536 or 536x800, depending on orientation.

Answer 1

You need to tell Highslide JS not to try to keep the controls in a fixed position.

<script type="text/javascript">
hs.addSlideshow({
    ......
    fixedControls: false
});
</script>

And anchor the image to the center of the viewport, rather than to the location of the thumbnail:

<script type="text/javascript">
hs.align='center';
</script>