Topic: Gallery Index & Juicebox gallery pages not resizing for mobile

My gallery index and underlying (juicebox) gallery pages are not resizing for mobile (or anything else) as expected.

These pages are embedded via iframes in an existing Magento based site.

The basic Juicebox pages are working fine but they are not within iframes.  I suspect it is the iframes causing the issue but I have not been able to find a way of embedding Showkase gallery index/galleries in an existing site without resorting to iframes.

Can you please provide some guidance on embedding without the use of iframes.

Thanks and regards,
David

Re: Gallery Index & Juicebox gallery pages not resizing for mobile

If you are loading your pages into iframes which have fixed pixel dimensions, then the iframes will not dynamically resize. They will always remain at their fixed dimensions.

You could embed a Juicebox gallery created and managed by Showkase in a non-Showkase page using the baseUrl method of embedding as documented here.
The gallery folder (whose name you will need for the baseUrl) is the name of the gallery page (in your root Showkase directory).

It is not possible to 'embed' a Gallery Index Page into a non-Showkase page. The best you could do is load it into an iframe.
You could perhaps give your iframe percentage dimensions rather then fixed pixel dimensions (via CSS) but its actual size will be dependent on its parent containers. If there is a fixed pixel value anywhere up the chain, then the iframe's size will become fixed (e.g. 100% x 800px = 800px). If you wanted to ensure that your iframe is responsive, you would need to ensure that all containers that the iframe is nested within also have percentage dimensions.
Otherwise, you could use JavaScript to listen for a change in the browser window's size and then assign new dimensions to the iframe on your page. This technique is used to resize the gallery container in the resizable examples here.
You could perhaps view the source of the sample web page in your browser and copy/modify the code to suit your own needs.