this.thediv has no properties

[Matpatnik]

Hi guys,I know absolutely nothing about JavaScriptHere is the link of the page: page testit give me this error

this.thediv has no properties in line 21

This is the code before I did some modification

<script type="text/javascript"><!--var time = 3000;var numofitems = 7;//menu constructorfunction menu(allitems,thisitem,startstate){   callname= "gl"+thisitem;  divname="subglobal"+thisitem;    this.numberofmenuitems = 7;  this.caller = document.getElementById(callname);  this.thediv = document.getElementById(divname);  this.thediv.style.visibility = startstate;}//menu methodsfunction ehandler(event,theobj){  for (var i=1; i<= theobj.numberofmenuitems; i++){	var shutdiv =eval( "menuitem"+i+".thediv");	shutdiv.style.visibility="hidden";  }  theobj.thediv.style.visibility="visible";}				function closesubnav(event){  if ((event.clientY <48)||(event.clientY > 107)){	for (var i=1; i<= numofitems; i++){	  var shutdiv =eval('menuitem'+i+'.thediv');	  shutdiv.style.visibility='hidden';	}  }}// --></script>...<script type="text/javascript">	<!--	  var menuitem1 = new menu(7,1,"hidden");			var menuitem2 = new menu(7,2,"hidden");			var menuitem3 = new menu(7,3,"hidden");			var menuitem4 = new menu(7,4,"hidden");			var menuitem5 = new menu(7,5,"hidden");			var menuitem6 = new menu(7,6,"hidden");			var menuitem7 = new menu(7,7,"hidden");	// --></script>

how can I fix this?Thank you for your help

[jesh]

At the bottom of your page, you are calling the following:

var menuitem1 = new menu(3,1,"hidden");var menuitem2 = new menu(3,2,"hidden");var menuitem3 = new menu(3,3,"hidden");var menuitem4 = new menu(3,4,"hidden");var menuitem5 = new menu(3,5,"hidden");var menuitem6 = new menu(3,6,"hidden");var menuitem7 = new menu(3,7,"hidden");

If you look at the function "menu", you'll see this:

function menu(allitems,thisitem,startstate){   callname= "gl"+thisitem;  divname="subglobal"+thisitem;    this.numberofmenuitems = 3;  this.caller = document.getElementById(callname);  this.thediv = document.getElementById(divname);  this.thediv.style.visibility = startstate;}

So, if you called "new menu(3,4,"hidden")", it would look like this:

function menu(3,4,"hidden"){   callname= "gl"+4;  divname="subglobal"+4;    this.numberofmenuitems = 3;  this.caller = document.getElementById(callname);  this.thediv = document.getElementById(divname);  this.thediv.style.visibility = "hidden";}

What happens next here is that document.getElementById is looking for an element with an id of "subglobal4" - but there aren't any elements with the id of "subglobal4". So, when you try to access the style object of this.thediv, you are getting an error.You'll have to match how many "subglobal#" elements you have on the page with the number of "new menu()" calls you make on the bottom of the page. If you only want 3 menus, and you only have "subglobal1", "subglobal2", and "subglobal3" in your HTML, then only use this in the bottom of your page:

var menuitem1 = new menu(3,1,"hidden");var menuitem2 = new menu(3,2,"hidden");var menuitem3 = new menu(3,3,"hidden");

I hope I've explained this well enough!

[Matpatnik]

hey thank you for the explanation but do I need to have the same amount of subglobal in each menu?because the way it is now the first menu have 6 subglobal, the second 3 subglobal and the third 2 subglobal.Or do I just delete this line: var menuitem7 = new menu(3,7,"hidden"); (because the maximum of subglobal is 6)

[jesh]

You should match the number of subglobal# elements you have with the number of menu items you build.If you add a "subglobal1" then you can call "menu(#,1,xxxxxxx)". If you add "subglobal23" then you can call "menu(#,23,xxxxxxx)". The number that you are passing to the menu function has to match the number following one of the subglobal elements.

[Matpatnik]

sorry if it took me almost a month to reply to this post. I was fare from my computer for few weeks Do I have to change something in the header? because I still have the same error.I think it have something to do with

function menu(allitems,thisitem,startstate){   callname= "gl"+thisitem;  divname="subglobal"+thisitem;    this.numberofmenuitems = 3;  this.caller = document.getElementById(callname);  this.thediv = document.getElementById(divname);  this.thediv.style.visibility = startstate;}

and

function closesubnav(event){  if ((event.clientY <48)||(event.clientY > 107)){	for (var i=1; i<= numofitems; i++){	  var shutdiv =eval('menuitem'+i+'.thediv');	  shutdiv.style.visibility='hidden';	}  }}

I tried to change the this.numberofmenuitems = 3; to 6 because I thought it was related to the sub global but everything stop working.and I'm thinking too that line if ((event.clientY <48)||(event.clientY > 107)){ have something to do with the sub global. I just can't put my finger on it but I'm sure that I'm getting close. Well I hope thx for your time