highslide: getting popup expand at center when screen size has changed

Question

I've been looking for an answer for quite a bit of time, but could not really find a solution. I have a problem with highslide js plugin. The thing is, that when I open a popup when page is loaded, it opens in the center of the screen (just where i want), but when page is resized without reloading, the popup wont be in the center anymore. Even when closed and reopened. If page size is decreased significantly, popup even goes off the screen. My question: Can I make it be at the center all the time?

JS:

<script type="text/javascript">
hs.graphicsDir = 'resources/slider/graphics/';
hs.outlineType = 'rounded-white';
hs.dimmingOpacity = 0.75;
hs.showCredits = false;
hs.restoreCursor = null;
hs.expandCursor = null;
hs.maxWidth = 400;
hs.align='center';
</script>

Link:

<a href="#"onclick="return hs.htmlExpand(this, { contentId: 'content', allowWidthReduction: true} )" class="highslide">Open</a>

Any help is welcome. Thank You in advance and sorry if my English is not perfect.

EDIT: There is an example: http://click.explode.lt/test. first expand it, then close. Without reloading the page, resize browser window and try expanding it again. Popup will not be in the center anymore. It fixes when page is reloaded. I'm looking for a solution to center it without reloading.

Thanks for looking into it.

Answer 1

You need to use:

hs.preserveContent = false;

But you could simplify the whole thing by making use of the CSS wrappers that Highslide already provides. Here's a quick demo, adapted from one of the old HS "barebones" examples:

(demo page removed)