Hi,

I've created a page with two instances of the sliding panels (SlidingPanels1 and SlidingPanels2) but noticed when I use the sidenav it slides both slide panels, not just the one I've focused on. The pagenav works fine, so problem seems specific to the sidenav. Here's a working example of the problem. www.webxmedia.co.uk/index2905.php

Here's a working example with the sidenav option removed.
www.webxmedia.co.uk

Also I've noticed a ghosting effect of the text/image sliding outside of the container. It's only one line of text but a little annoying. Any ideas or suggestions?

Otherwise a great product!!

Thanks Matt.

DMXzone any comment to my post please? Fix, work around?

Matt, here is what I ended up doing.
FYI: This method will disengage the DMX extension on for these instances. So, edits will be manual.

1) move the ID to the top ancestor of each instance.
It should look like this:

<div id='SlidingPanels1' class='dmxSlidingPanelsView'>...</div>
<div id='SlidingPanels2' class='dmxSlidingPanelsView'>...</div>

2) Setup the specificity to reference the ID and Class. See bellow...

3) At the end of the dmxSlidingPanels.js file are default variables that can be customized. Again, setup the specificity to reference the ID and Class. I tossed in the parent Tag, too for good measure.

jQuery("#SlidingPanels1> .dmxSlidingPanelsView").dmxSlidingPanels({
pageClass:"dmxSlidingPanelsPage", 
pageNavigation:"#SlidingPanels1> .dmxSlidingPanelsNav", 
prevPage:"#SlidingPanels1> div> .dmxSlidingPanelsPrev", 
nextPage:"#SlidingPanels1> div> .dmxSlidingPanelsNext"});

jQuery("#SlidingPanels2> .dmxSlidingPanelsView").dmxSlidingPanels({
pageClass:"dmxSlidingPanelsPage", 
pageNavigation:"#SlidingPanels2> .dmxSlidingPanelsNav", 
prevPage:"#SlidingPanels2> div> .dmxSlidingPanelsPrev", 
nextPage:"#SlidingPanels2> div> .dmxSlidingPanelsNext"});

Good luck!
M.WIDOW