View Full Version : CMotion Image Gallery II not working in a tab control

01-23-2008, 03:00 PM
1) Script Title: CMotion Image Gallery II not working in a tab control

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/cmotiongallery2.htm

3) Describe problem: Has anyone tryed to get the CMotion Image Gallery I / II to work inside of a tab control? What is happening is I have a Spry Tab Control that has five tabs and I need to have the photo slide show in the fourth or fifth tab. When I place the code that normally goes into the body section into the tab control, the slider function no longer works.
Is there a way I can call the control inside the tab using getElementById or using innerHTML ?

The tab control is a javascript file that is called using

<div id="MainTabs" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0"><a><span>Attractions</span></a></li>
<li class="TabbedPanelsTab" tabindex="1"><a><span>Restaurants</span></a></li>
<li class="TabbedPanelsTab" tabindex="2"><a><span>Events</span></a></li>
<li class="TabbedPanelsTab" tabindex="3"><a><span>Campgrounds</span></a></li>

<div class="TabbedPanelsContentGroup">

<!-- BEGIN Attractions Panel div -->
<div class="TabbedPanelsContent attractionsPanel">

Tabindex 3 is where I am putting my code to for the Cmotion Image Gallery photo slideshow. Let me know what other information you may need and thank you for your assistance.

01-23-2008, 04:03 PM
It really depends upon how Spry tab works. I'm imagining that it takes the innerHTML from the appropriate unseen division and places it in a seen division. If this is so, I really don't think that the two scripts are strictly compatible without extensive modification, though a work around (using iframe, see below) might be possible. Can Spry Tabs import content to an iframe or via Ajax? If so, it might be a little easier to get it to work. The problem is that the Cmotion initializes its content by id on page load. If you have this content in a hidden Spry Tab division, it will get initialized, but be unseen. If you then copy that code to the visible Spry Tab area, it will no longer be initialized, and will be impossible to initialize because now the page has more than one of each element on it with the id's that the script would look for to initialize it.

Perhaps if you were to put the gallery on a separate page, and put an iframe in its hidden Spry Tab division that had as its source that separate page, that might work.

01-25-2008, 08:56 PM
Thank you John, I will try an IFRAME and see if that does the trick. Thanks again.