Regarding onclick, change parent class and not onclick

[MrTIMarshall]

Hello,

Javascript

	<script type="text/javascript">
		var ddmenuitem	= 0;
		// open hidden layer
		function mopen(id)
		{	
			// close old layer
			if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
		
			// get new layer and show it
			ddmenuitem = document.getElementById(id);
			ddmenuitem.style.visibility = 'visible';
			ddmenuitemparent = document.getElementsByClassName(this).parentNode;
			ddmenuitemparent.className = ddmenuitemparent.className("active");
		}
	</script>

The above Javascript code all works, as you can see on my page here, apart from my attempt to implement the onclick="mopen('login'); parentNode.className=('active')" into the above Javascript code.

My Edit

			ddmenuitemparent = document.getElementsByClassName(this).parentNode;
			ddmenuitemparent.className = ddmenuitemparent.className("active");

What I am trying to achieve; When you click on one of the right side drop-downs on the navigation bar, the parent class changed to 'active' (apart from the search actions needing to switch to 'NewSearchActionsactive') and for them to switch back when another drop down is clicked or outside of this area is clicked.

Thank you in advanced for any help and/or advice in fixing my problems.

Best Regards,
Tim

[MrTIMarshall]

Okay, so I am getting somewhere now...

I have managed to get the last two drop downs to work properly apart from hiding and switching back classes when you click out of the area.

I now only need help with implementing it into the drop down for the menu options and when you click outside of the area.

[Old Pedant]

I don't see how this works:
ddmenuitemparent = document.getElementsByClassName(this).parentNode;

getElementsByClassName returns an *array* (okay, technically a collection). So how can you get the parentNode of an entire collection?

On top of that, getElementsByClassName is expecting, as the name says, a *NAME* as its argument. You are, instead, passing in an object (this is always an object of some kind, it would not likely be a class name).

[Old Pedant]

Also, you wrote "The above Javascript code all works, as you can see on my page here." Umm...no, I can't see that. You didn't provide a URL to your page.

[MrTIMarshall]

Originally Posted by Old Pedant

Also, you wrote "The above Javascript code all works, as you can see on my page here." Umm...no, I can't see that. You didn't provide a URL to your page.

Sorry, I've been having a few difficulties with this and it's been driving me a little crazy.

Site link: https://tornhq.com/Top_Menu/Index-New.html#

[Old Pedant]

Well, that code looks nothing like what started this thread.

So I don't have any idea now whether you think it is working or not.

[MrTIMarshall]

Basically there are three drop down's at the moment. All drop downs currently work and change the classes of the parentNodes with the acception of the searchactions being switched to searchactionsactive.

The problem is, I would only like one to be able to be open at a sinfular time, which means any other ones hide and any classes changed, change back. Also, if the visitor clicks outside of the area, it should hide any drop downs.

[Old Pedant]

> Also, if the visitor clicks outside of the area, it should hide any drop downs.

Harder to do. Sure you wouldn't be happy with just "if the mouse is moved outside the area..."??

[MrTIMarshall]

Hiya Old Pedant,

Personally, although I am a minority, I would much prefer if the drop-down was hidden upon a click outside of the container due to being registered blind/severally-sighted and needing the Windows magnifier on at least x500 to use my system, Using any drop down menu's which hide instantly are very difficult for myself.

If it is much harder to program, maybe a delayed timer is set for so many seconds of the mouse being off the container? - I'm not sure how well that would work, or if visitors would understand why the container has hidden whilst entering their details or whatnot.

I'm not sure if this will effect any help you provide if you do, programming wise, however just in case it might, I am also having minor styling problems which you can view the thread I have made here; http://www.codingforums.com/showthread.php?t=289772

Best Regards,
Tim

[MrTIMarshall]

Hiya again Old Pedant,

Just a note to say that it's a shame we're not in the same timezone and I need to go to bed now but I'll reply to any messages when I awake tomorrow.

Best Regards,
Tim

[Old Pedant]

Well, this is certainly not my area of expertise. I'd have to muck around with it for a while.

I guess what you could do is register an onclick handler for the entire document.body and then any click not "caught" by some other handler would trigger the close.