• Registered: 2009-09-13
  • Posts: 5

Topic: Getting multiple galleries to work on the same html page

I purchased SV Builder Pro 2.1.1 about a year ago.

I'm a little rusty.

I'm trying to create a 4 gallery slideshow on my main homepage:
http://www.taylor-graphics.net/landing_page.html

I want to create a similar multiple gallery slideshow as you've done:
http://www.simpleviewer.net/simpleviewe … index.html

But, when you click on each of my category button links (Graphic Design, Web Design, Caricatures or Photography) you'll see that when you do they take you to separate index pages.

I've created 4 separate galleries for all the files, including 4 separate index.html file associated with its own category. I believe my pathing files are correct. Maybe not?

My 4 galleries contain only 1 image each, as I'm testing it out for right now. But, each image is numbered in sequence (1, 2 ,3, 4).

I'm uncertain what to do next.

Here's my html - I'm sure there's something wrong. (The 4 button links are javascript rollovers.)

<div id="slideshow">
<div id="slideshowmenu" align="center">
<a href="images/new_tg_site/graphic_design_gallery/index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image9','','images/new_tg_site/gd_button_over.jpg',1)"><img src="images/new_tg_site/gd_button.jpg" name="Image9" width="130" height="20" border="0" id="Image9" /></a>

<a href="images/new_tg_site/web_design_gallery/index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image10','','images/new_tg_site/wd_button_over.jpg',1)"><img src="images/new_tg_site/wd_button.jpg" name="Image10" width="130" height="20" border="0" id="Image10" style="padding: 0px 0px 0px 5px;" /></a>

<a href="images/new_tg_site/caricatures_gallery/index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image11','','images/new_tg_site/caricature_button_over.jpg',1)"><img src="images/new_tg_site/caricature_button.jpg" name="Image11" width="130" height="20" border="0" id="Image11" style="padding: 0px 0px 0px 5px;" /></a>

<a href="images/new_tg_site/photography_gallery/index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image12','','images/new_tg_site/photography_button_over.jpg',1)"><img src="images/new_tg_site/photography_button.jpg" name="Image12" width="130" height="20" border="0" id="Image12" style="padding: 0px 0px 0px 5px;" /></a></div>

<!--START SIMPLEVIEWER EMBED -->
    <script type="text/javascript" src="images/new_tg_site/graphic_design_gallery/svcore/js/simpleviewer.js"></script>
    <script type="text/javascript">
    jQuery(document).ready(function () {
        SV.simpleviewer.load('sv-container', '100%', '100%', '222222', true );
    });
    </script>
    <div id="sv-container"></div>
    <!--END SIMPLEVIEWER EMBED -->
</div>

Thanks for your help and troubleshooting!

  • Registered: 2008-07-06
  • Posts: 6,334

Re: Getting multiple galleries to work on the same html page

The Multiple Gallery example you quote duplicates all content on both 'gallery1/index.html' and 'gallery2/index.html' so you could replicate this by replacing 'graphic_design_gallery/index.html' (and all your other gallery HTML index pages) with 'landing_page.html' so that each gallery's HTML index page contains your header and links to all galleries (rather than just the gallery itself). The only difference between the pages would be the gallery that is displayed.

An alternative would be to replace the embedding code on your 'landing_page.html' with an <iframe> and target the <iframe> with each gallery when a link is selected, eg:

<a href="images/new_tg_site/graphic_design_gallery/index.html" target="gallery" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image9','','images/new_tg_site/gd_button_over.jpg',1)"><img src="images/new_tg_site/gd_button.jpg" name="Image9" width="130" height="20" border="0" id="Image9" /></a>

<a href="images/new_tg_site/web_design_gallery/index.html" target="gallery" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image10','','images/new_tg_site/wd_button_over.jpg',1)"><img src="images/new_tg_site/wd_button.jpg" name="Image10" width="130" height="20" border="0" id="Image10" style="padding: 0px 0px 0px 5px;" /></a>

<a href="images/new_tg_site/caricatures_gallery/index.html" target="gallery" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image11','','images/new_tg_site/caricature_button_over.jpg',1)"><img src="images/new_tg_site/caricature_button.jpg" name="Image11" width="130" height="20" border="0" id="Image11" style="padding: 0px 0px 0px 5px;" /></a>

<a href="images/new_tg_site/photography_gallery/index.html" target="gallery" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image12','','images/new_tg_site/photography_button_over.jpg',1)"><img src="images/new_tg_site/photography_button.jpg" name="Image12" width="130" height="20" border="0" id="Image12" style="padding: 0px 0px 0px 5px;" /></a></div>

<iframe id="gallery" name="gallery" src="images/new_tg_site/graphic_design_gallery/index.html" width="800" height="600" frameborder="0" scrolling="no"></iframe>
Steven Speirs
SimpleViewer Support Team
  • Registered: 2009-09-13
  • Posts: 5

Re: Getting multiple galleries to work on the same html page

Thank you, Steven. The iFrame seems to be working. I'm in the process of configuring the multiple gallery slideshow now.

- John