Problem with using two mootools plugins

[AlanN]

Hello all,

I am trying to implement into my website, two different mootools plug ins. One is for making tabs within a div and the other creates a vertical accordion menu. When all the files are linked to the html document, the accordion stops working and displays as unorder list as the html calls for it. Is there a code that I can add to my head section to keep these two from interfering with one another. If needed I can supply the code.

Thanks in advance.
Alan

 

[angelwatt]

They both might be trying to override an event during onload. Seeing the code would probably help diagnose it further.

 

[AlanN]

Here is the head -->
<link rel="stylesheet" href="style.css" type="text/css" />

<script type="text/javascript" src="js/mootools.js">
</script>

<script type="text/javascript" src="js/byslidemenu.js">
</script>
<script src="js/mootabs1.2.js" type="text/javascript" charset="utf-8">
</script>
<script type="text/javascript" src="js/typeface-0.12.js"></script>
<script type="text/javascript" src="js/gentilis_bold.typeface.js"></script>

link rel="stylesheet" href="mootabs1.1.style1.css" type="text/css" media="screen" title="no title" charset="utf-8" />

<script src="js/mootools.v1.1.js" type="text/javascript" charset="utf-8"></script>
<script src="js/mootabs1.2.js" type="text/javascript" charset="utf-8"></script>

<script type="text/javascript" charset="utf-8">
window.addEvent('domready', init);
function init() {
myTabs1 = new mootabs('myTabs', {height: '500px', width: '650px', changeTransition: 'none', mouseOverClass: 'over'});

}
</script>

end of head-->


other js-->
<script type="text/javascript">
//<![CDATA[
var verticaltextmenu;
window.addEvent('load', function(){

var verticalmenu = new BySlideMenu('verticalmenu', {vertical: true, autosize: true});
});

//]]>
</script>

end of other js-->

Let me know if you need anything else like html or other js information. Thanks for any thing you can give me help on.

 

[angelwatt]

It kind of looks like you have two mootools main files, one with a version number and the other without. You may want to try to get rid of the versioned one to see if that helps (or vice versa).

<script type="text/javascript" src="js/mootools.js">
</script>

<script src="js/mootools.v1.1.js" type="text/javascript" charset="utf-8"></script>

It's possible these files are defining the same types of things, which would cause problems. In your browser if you check out the Error Console from the Tools menu it may list some errors that could give clues.

If you have the page somewhere you can link to, it would better help figure out the problem since the issue likely lies inside one or more of the included JavaScript files, and posting them here would be cumbersome. If you want though, you could zip them up and add them as an attachment to a post.

 

[AlanN]

Does it matter which one I use? As you can tell I am a slight beginner with JS.

 

[angelwatt]

Does it matter which one I use? As you can tell I am a slight beginner with JS.

It's possible they're the same exact file. I wouldn't have a clue without looking. The unversioned one may list the version inside the file at the top.

 

[AlanN]

the link is www.simondr.com/newsite/whitecap.html

 

[angelwatt]

Looks like the first mootools file is version 1.2.1 compared to the other one which is 1.1. I would take out the 1.1 version. You also have included mootabs1.2.js in there twice. Delete one (either).

There could be an order issue with including the various JavaScript files, but no errors are popping up currently so wouldn't worry about that just yet.

 

[AlanN]

I removed the mootools v 1.1 js file and one of the mootabs js files. The vertical menu now works but the tabs are the only part that has been displayed in the main content area. I believe there was something in the mootoolsv.1.1.js that was removed that isnt in the newer one...or am I wrong?

 

[angelwatt]

It does seem to be a conflict between the two different Mootools versions. You'll have to give up one or find a different plugin.