Results 1 to 3 of 3

Thread: Problem with Switch Menu II

  1. #1
    Join Date
    Nov 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Arrow Problem with Switch Menu II

    Switch Menu II
    http://www.dynamicdrive.com/dynamici...witchmenu2.htm

    ---------------------------------------------------------

    I love the script - have been working on it for awhile now.. is it possible to make the previous menu collapse when another is clicked? Right now, when you click on one menu item, its submenu opens. You click on another but the previous menu item is still expanded.

    Any help would be appreciated!!

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    See this Post.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    While the code from the post mentioned in my previous post is sufficient to get this script working as a "collapse previous" version of itself. I've just been looking into the whole matter a bit more deeply. Certain problems existed with this script to begin with. The HTML comments are not valid when using even the loosest DOCTYPE declaration, rendering the menu invisible in FF. There are a number of each of these two comments in the demo markup:

    HTML Code:
    <!--------Start Menu---------->
    and:

    HTML Code:
    <!--------End Menu---------->
    They should be:

    HTML Code:
    <!-- Start Menu -->
    and:

    HTML Code:
    <!-- End Menu -->
    That takes care of that. Then, there is a problem that arises, potentially, when you are collapsing previous contents. A situation may arise where the mouse cursor is over one of the other headers without actually having been moused over it. If this happens, odd things can result, especially in FF. To fix this, in the HTML markup only (not in the script part) where it says:

    HTML Code:
    onMouseOver="Init(this)"
    make all of those:

    HTML Code:
    onmousedown="Init(this)"
    OK, we are done with that one. Now in the code for menu.js, there are three places where height as style is set, units (added to the below examples in red) should be specified (I know, the third one looks like the first but, there is no semicolon at the end and there are the three of these all told):

    Code:
    OBJ_SLIDE.style.height = NEW_PIX_VAL+'px';
    Code:
    if(NEW_PIX_VAL > 0)OBJ_SLIDE.style.height = NEW_PIX_VAL+'px';
    and:

    Code:
    OBJ_SLIDE.style.height = NEW_PIX_VAL+'px'
    Together with the modification from the post linked to my previous post in this thread, these changes will result in a much more robust script. I didn't stop there though. I thought that there should be a slight but just noticeable pause between when the previous menu collapses and the current one drops down. To achieve this, start with a copy of menu.js with only the three +'px''s added, without the modifications from the post linked to my previous post. Replace the entire function:

    Code:
    function SetSlide()
    {   
    			if (window.TIMER_SLIDE) clearInterval(TIMER_SLIDE) //DD added code
          if (TIMER_SLIDE == null && this.parentNode == MainDiv)
                TIMER_SLIDE = setInterval('RunSlide()', DELAY_SLIDE);
          else
          {
              RE_INIT_OBJ = this;
              setTimeout('ReInit()', 200);
          }
    }
    with these globally declared variables and this updated version of the function:

    Code:
    var tmp1, flag=0
    function SetSlide(it)
    {
    if (!flag&&it!==1){
    tmp1=OBJ_VIEW;
    subs=document.getElementsByTagName('DIV')
    for (i = 0; i < subs.length; i++)
    if (subs[i].className=='subMenu'&&subs[i].getAttribute("state", 0)!="0"&&subs[i]!==tmp1){
    OBJ_VIEW=subs[i]
    OBJ_SLIDE=subs[i].parentNode
    MainDiv=subs[i].parentNode.parentNode
    RunSlide()
    flag=1
    }
    }
    if (flag&&it!==1){
    OBJ_VIEW=tmp1
    OBJ_SLIDE=tmp1.parentNode
    MainDiv=tmp1.parentNode.parentNode
    flag=0
    setTimeout("SetSlide(1)", 60)
    return;
    }
      
    			if (window.TIMER_SLIDE) clearInterval(TIMER_SLIDE) //DD added code
          if (TIMER_SLIDE == null && this.parentNode == MainDiv)
                TIMER_SLIDE = setInterval('RunSlide()', DELAY_SLIDE);
          else
          {
              RE_INIT_OBJ = it==1? OBJ_SLIDE : this;
              setTimeout('ReInit()', 200);
          }
    }
    That's it!
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

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