Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 11 of 11
  1. #1
    Regular Coder
    Join Date
    Nov 2010
    Posts
    393
    Thanks
    48
    Thanked 1 Time in 1 Post

    Unhappy Regarding onclick, change parent class and not onclick

    Hello,

    Javascript
    Code:
    	<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
    Code:
    			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

  • #2
    Regular Coder
    Join Date
    Nov 2010
    Posts
    393
    Thanks
    48
    Thanked 1 Time in 1 Post
    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.

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,947
    Thanks
    79
    Thanked 4,424 Times in 4,389 Posts
    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).
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,947
    Thanks
    79
    Thanked 4,424 Times in 4,389 Posts
    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.
    Last edited by Old Pedant; 03-14-2013 at 02:08 AM.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #5
    Regular Coder
    Join Date
    Nov 2010
    Posts
    393
    Thanks
    48
    Thanked 1 Time in 1 Post
    Quote Originally Posted by Old Pedant View Post
    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#

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,947
    Thanks
    79
    Thanked 4,424 Times in 4,389 Posts
    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.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #7
    Regular Coder
    Join Date
    Nov 2010
    Posts
    393
    Thanks
    48
    Thanked 1 Time in 1 Post
    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.

  • #8
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,947
    Thanks
    79
    Thanked 4,424 Times in 4,389 Posts
    > 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..."??
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #9
    Regular Coder
    Join Date
    Nov 2010
    Posts
    393
    Thanks
    48
    Thanked 1 Time in 1 Post
    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

  • #10
    Regular Coder
    Join Date
    Nov 2010
    Posts
    393
    Thanks
    48
    Thanked 1 Time in 1 Post
    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

  • #11
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,947
    Thanks
    79
    Thanked 4,424 Times in 4,389 Posts
    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.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •