Sliding Panels Support Product Page

This topic is locked
Answered

Sidenav issue with 2 instances

Asked 29 May 2010 03:37:37
1
has this question
29 May 2010 03:37:37 Matt Whiteman posted:
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.

Replies

Replied 15 Jun 2010 02:48:38
15 Jun 2010 02:48:38 Matt Whiteman replied:
DMXzone any comment to my post please? Fix, work around?
Replied 11 Jun 2011 13:09:43
11 Jun 2011 13:09:43 Jacob Canote replied:
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

Reply to this topic