Cmotion scroller help

[freal0s]

hye guys,
i'm in the need of help here,

i was trying to put an gallery scroller using Cmotion script, http://dynamicdrive.com/dynamicindex...iongallery.htm . it works just fine, but my problem is, i want to put 2 scrollers in 1 page. it seems that only 1 scroller are working. any body could help me on this is much appreciated..

thanx you!!

[jscheuer1]

In future, please post about Dynamic Drive Scripts in the Dynamic Drive Scripts Help section here where I've moved this thread.

For more than one cmotion on a page, you would need a multiple use version like:

http://home.comcast.net/~jscheuer1/s...cmotion_oo.htm

Use your browser's 'view source' to get the code and also download and use the two resource files (right click and 'save as') -

The css:

http://home.comcast.net/~jscheuer1/s...rystyle_oo.css

The script:

http://home.comcast.net/~jscheuer1/s...ngallery_oo.js

[freal0s]

jscheuer1, thanx soooo much!!
ermm..but how i add the images? i mean not in the js file..i need to add the images inside the html not hardcoded inside the js file..thank you..

[jscheuer1]

Well, they could be easily declared in a separate javascript on or linked to the page. But I suppose it would depend upon why. I'm imaging that you might want to use it with another script (like Lightbox, perhaps?) that needs to initialize its links for them to work with that script. If so, there may be (is, if Lightbox is the other script) an easy way to take care of that without putting the images on the page.

[freal0s]

yes, i am thinking of doing it with 2 js file, but the problem is, i dunno which attribute to change inside the js file. was thinking using motiongallery.js and motiongallery2.js. and the div would call different IDs.

But i have to admit, my knowledge on javascript is not that good. i'm lost when i look at the js file, would u help me on changing the codes inside the 2nd js file so that 1st scroller would depend on motiongallery.js and the 2nd scroller depend on the motiongallery2.js.

thank you very much

[jscheuer1]

That's not what I was talking about. Why do you need the images on the page?

[freal0s]

how do i add the images at the html?, coz oo cmotion scripts add the images inside the js file..

[freal0s]

it's like this,

on the page, i'm using a tab script for upcoming event and current event. I want to use the cmotion for displaying thumbnail pics of both of the events. so basicly, i'm using 2 cmotions inside one page. and to add the images, i have to insert the links using the divs and not hardcoded inside the js file.

[jscheuer1]

What tab script? What links? You may use any script you like, it should be able to be worked out. Any links or events you need associated with the images in Cmotion can be placed in the js file. The only problem could be if the links need to be initialized by the tab script. But, if that happens onload, they will be on the page by that time anyway, so shouldn't be a problem.

[freal0s]

function showTab(tabName, typeOfTab) {
if (typeOfTab==1)
{
var arrTable = new Array('step1', 'step2');
var arrButton = new Array('btnTabStep1', 'btnTabStep2');

for(var i=0; i<arrTable.length; i++) {
if(tabName == arrTable[i]) {
showHide(tabName, 'block');
document.getElementById(arrButton[i]).className = 'showActiveBtn1';
}
else {
showHide(arrTable[i], 'none');
document.getElementById(arrButton[i]).className = 'blurActiveBtn1';
}
}
}
else if (typeOfTab==2)
{
var arrTable = new Array('menu1', 'menu2');
//var arrButton = new Array('btnTabStep1', 'btnTabStep2', 'btnTabStep3', 'btnTabStep4', 'btnTabStep5', 'btnTabStep6');

for(var i=0; i<arrTable.length; i++) {
if(tabName == arrTable[i]) {
showHide(tabName, 'block');
//document.getElementById(arrButton[i]).className = 'showActiveBtn1';
}
else {
showHide(arrTable[i], 'none');
//document.getElementById(arrButton[i]).className = 'blurActiveBtn1';
}
}
}
else {
var arrTable = new Array('step1', 'step2');
var arrButton = new Array('btnTabStep1', 'btnTabStep2');

for(var i=0; i<arrTable.length; i++) {
if(tabName == arrTable[i]) {
showHide(tabName, 'block');
document.getElementById(arrButton[i]).className = 'showActiveBtn';
}
else {
showHide(arrTable[i], 'none');
document.getElementById(arrButton[i]).className = 'blurActiveBtn';
}
}
}
}

i'm using that script for the tabs..and

<a href="javascriptnClick=showTab('menu1', 2)">current</a>
<a href="javascriptnClick=showTab('menu2', 2)">upcoming</a>


<div id="menu1" style="display: block;"> *put the step 2 div codes here</div>
<div id="menu2" style="display: none;"> *put the step 2 div codes here</div>

for the image insertions

so, when i clicked on 'current' link, it wud show div menu1 which i inserted the img src codes for the images, and when i click 'upcoming', it wud show div menu2. the tab already worked, but the problem is the scrolling. the 1st scroll wont scroll because of the overwrite of the js file used by the 2nd scroll. what i was thinking was duplicating the js file to motiongallery2.js and change the div's ID to motioncontainer2, motiongallery2 and trueContainer2. and i'm supposed to change the motiongallery2.js too right? but i dunno which and what to rename