2 HS elements on Same Page with Different Behaviors

[6foot8]

Hello there. I love this product! I am a little stuck trying to achieve one thing though.

URL: http://wvv.com/visit/facilities_catering_NEW/

The image gallery is behaving exactly as I'd like it to. And the HTML pop ups almost as I'd like them to. Ideally though, I would like for the HTML links to behave independently of one another so that they don't act as a slideshow with a control bar.

I've searched all over and can't find anyone else who has posted anything like this except a guy who had an error in his own code somewhere - that was beyond me though. Is what I want to do possible? Thank you.

-Vic

[RoadRash]

Hi Vic,

First you need to add slideshowGroup to all onclicks for the images.

Code: Select all

onclick="return hs.expand(this, {slideshowGroup: 'group1'})"

Then you need to remove the double slash // in front of the slideshowGroup line in the addSlideshow part between the head tags.

Code: Select all

   // Add the controlbar
   hs.addSlideshow({
      slideshowGroup: 'group1',
      interval: 5000,
      repeat: false,
      useControls: true,
      fixedControls: 'fit',
         overlayOptions: {
            opacity: .75,
            position: 'bottom center',
            hideOnMouseOut: true
      }
   });

Doing this will tie the controlbar to the popups with slideshowGroup: 'group1'.

BTW – you should never include two highslide js files. You have both highslide-with-gallery.js and highslide-full.js. You can remove highslide-with-gallery.js since highslide-full.js covers all Highslide functions.

[6foot8]

Brilliant. I think I'm all set now. Thank you!

-V