The link you have provided redirects to http://afrika.delosgaia.nl/index.htm and there seems to be only a SimpleViewer gallery on the page. I see neither a Juicebox-Pro gallery, nor the code you posted (only <div id="box_slideshow"></div>).

I'm not sure it will help (as I have not yet seen the page containing your Juicebox-Pro gallery) but take a look at this FAQ (it relates to IE9 but may also be relevant to IE8):
My gallery looks strange in Internet Explorer 9. Why?

Also, if you are embedding your Juicebox-Pro gallery directly into your 'box_slideshow' <div>, then try removing the 'style' attribute from the <div>, set your gallery's dimensions using the galleryWidth and galleryHeight configuration options (in the embedding code) and, if expressing galleryWidth and galleryHeight as percentages, check all parent containers of your 'box_slideshow' <div> to ensure that they all have heights specified via CSS.

There have been a couple of issues specific to IE8 (regarding the opacity of thumbnail frames and the the FADE image transition type) but these have already been addressed and will be fixed in the next version of Juicebox-Pro.
Just to let you know, there are no known issues regarding gallery sizing in IE8.

If you continue to experience difficulties, please post the link to your Juicebox-Pro gallery so that I can take a look and investigate further.

There is a lot going on within your web page and as it loads, you can visibly see elements shifting around until they settle in place (as the JavaScript and CSS is being rendered by the browser).

There are differences in your web page, not just between versions of Internet Explorer but also between different browsers.
For example, in Firefox 19.0.2, your 'Select Language' combobox is initially completely obscured by the gallery (which it is not in IE10, Chrome 25 or Safari 5.1.7) but it partially appears if you resize the browser window and then maximize it.

As you are expressing your galleryWidth and galleryHeight as percentages, check all parent containers of the Juicebox container (your 'box_slideshow' <div>) to ensure that they all have heights specified via CSS and please see the Using Percentage Heights note in the embedding guide. This suggests using inline CSS on the parent containers rather than on the Juicebox container (your 'box_slideshow' <div>) itself.

If there is a problem with the gallery not being able to determine it's height in certain browsers, then you could perhaps express your gallery's height as a fixed pixel value rather than as a percentage.

Another workaround might be to isolate the gallery completely from the rest of your web page by embedding it using an <iframe>, documented as Option #2 here. As your gallery does not use the Expand Button or Back Button, there should be no drawbacks to using an <iframe>. This should avoid any conflicts with your main page and should hopefully work in all browsers.

Hi Steven,
I have made a far better solution without problems about unwanted resizing of parent div.
See yourself at http://afrika.delosgaia.nl/visit_to_madagascar.htm.
What I have done is:
$(window).bind('resize load', function(e){
var browserWidth = $('body').width();
if(browserWidth>=1310){
    new juicebox({
        baseUrl: 'http://afrika.delosgaia.nl/design4/header/madagascar/',
        containerId: 'box_slideshow',
        galleryWidth: '917px',
        galleryHeight: '273px',
        backgroundColor: 'rgba(255,255,255,0)'
        });
}
if(browserWidth<1310 && browserWidth>=1110){
new juicebox({
        baseUrl: 'http://afrika.delosgaia.nl/design4/header/madagascar/',
        containerId: 'box_slideshow',
        galleryWidth: '795px',
        galleryHeight: '237px',
        backgroundColor: 'rgba(255,255,255,0)'
        });
}
if(browserWidth<1110){
new juicebox({
        baseUrl: 'http://afrika.delosgaia.nl/design4/header/madagascar/',
        containerId: 'box_slideshow',
        galleryWidth: '619px',
        galleryHeight: '185px',
        backgroundColor: 'rgba(255,255,255,0)'
        });
};});

You will need is jQuery.fn.browserSizr = function(options). See http://data.delosgaia.nl/resources4/jqu … wwsizer.js