attatched JavaScript canceled out the main JS

**shtoom** · Dec 21, 2006, 16:55

the site in question

This problem is for IE 6 only! Strangely it works in IE 7 and FF.

I have 2 JavaScripts on the frontpage of this site both doing 2 totally different things!
One is for the drop down menu and the other is for speech bubbles. I put the JavaScript for the speech bubbles in a seperate file and attatched it.

Code:

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

The JS for the drop down menu is in the index file

Code:

<script type="text/javascript"><!--//--><![CDATA[//><!--

startList = function() {
	if (document.all&&document.getElementById) {
		navRoot = document.getElementById("nav");
		for (i=0; i<navRoot.childNodes.length; i++) {
			node = navRoot.childNodes[i];
			if (node.nodeName=="LI") {
				node.onmouseover=function() {
					this.className+=" over";
				}
				node.onmouseout=function() {
					this.className=this.className.replace(" over", "");
				}
			}
		}
	}
}
window.onload=startList;

//--><!]]></script>

If I put the attatched JS below the drop down menu then the drop down menu works but the speech bubbles dont work. Same thing happens if I switch them so the JS for the drop down menu is under the attatched JS then the speech bubbles work and the drop down menu doesnt.

The only browser thats giving me a problem is IE 6 now.. Any ideas people please?

Merry Christmas and happy new year!

**mrhoo** · Dec 21, 2006, 20:32

The best idea is to put all your script text outside of the html,
in script elements with src attributes,
like you did with the tooltip script.

**shtoom** · Dec 21, 2006, 23:01

This doesnt solve the problem tho. Ive attatched the drop down menu JS now (nav.js).

Code:

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

Now ive made the nav is attatched it doesnt work in FF or IE 7. When you roll over VIEW a speech bubble it should appear but only the drop down menu works!?

I think its some sort of parent / child or primary / slave thing going on here.. Any ideas please?

**Kravvitz** · Dec 22, 2006, 00:45

The problem is that when you set window.onload a second time it overrides the first time you set it.

You either need to use a set of event manipulation functions, like the ones by Dean Edwards or do something like this:

Code:

window.onload = function() {
  makeNiceTitles();
  startList();
}

**shtoom** · Dec 22, 2006, 01:11

I added this code at the end of the tooltips.js and it hasnt fixed it..

Code:

window.onload = function() {
  makeNiceTitles();
  startList();
}

I read Dead Edwards but its hard to understand because im very new to JS! Dean Edwards said try this:

Code:

<body onload="doSomething()">

Im not sure what to do..

**Kravvitz** · Dec 22, 2006, 01:15

Originally Posted by shtoom

I added this code at the end of the tooltips.js and it hasnt fixed it..

Code:

window.onload = function() {
  makeNiceTitles();
  startList();
}

You need to remove the line where you set window.onload in the other file.

Originally Posted by shtoom

I read Dead Edwards but its hard to understand because im very new to JS! Dean Edwards said try this:

Code:

<body onload="doSomething()">

Dean put that in his post to say that his script includes some code to keep that from preventing window.onload from working. It's bad practice to use inline events, especially on <body>.

**shtoom** · Dec 22, 2006, 11:59

alright excellent thanks it works!!!!!
Merry Christmas and happy new year!!!!!

The SitePoint Forums have moved.

User Tag List

Thread: attatched JavaScript canceled out the main JS

Thread Tools

Display

attatched JavaScript canceled out the main JS

Bookmarks

Bookmarks

Posting Permissions