click() function does not have same effect as real click (IE 6)

Discussion in 'Javascript' started by Lazlo Woodbine, May 14, 2004.

  1. I'm trying to implement a dynamic menu using CSS/DHTML/JavaScript. The
    menu bar is implemented as hyperlinks so I can use the :hover :active
    etc. pseudo-styles.

    When moving from one item to another on the menu bar I want to
    simulate the user clicking on the menu bar item they've just moved
    onto, so the adjacent menu drops down automatically.

    So I have something like this:

    function MenuBarItemMouseover(menuBarItem)
    {
    menuBarItem.click();
    }

    to simulate the user clicking on the adjacent menu.

    However it seems the previous menu bar item stays in the 'active'
    state and the item that has been moved onto remains in the 'hover'
    state.

    The css styles are defined in the order: link, visited, hover, active,
    and in any case, it works fine if you actually do a mouse click on a
    different menu bar item. It seems the programmatic click is not the
    same.

    Is there anyway of forcing the previous link to 'normal' and the new
    link to 'active' using JavaScript? Or is there some other way of
    simulating a mouse click?
    Lazlo Woodbine, May 14, 2004
    #1
    1. Advertising

  2. It turns out the answer is very simple. ¬°Hurrah!

    You need to call focus() on the item that you wish to click, since
    click() itself does not change the focus (on IE 6), and hence the
    active status of the 2nd item doesn't change:

    function MenuBarItemMouseover(menuBarItem)
    {
    menuBarItem.focus();
    menuBarItem.click();
    }

    On 14 May 2004 11:00:10 -0700, (Lazlo Woodbine)
    wrote:

    >I'm trying to implement a dynamic menu using CSS/DHTML/JavaScript. The
    >menu bar is implemented as hyperlinks so I can use the :hover :active
    >etc. pseudo-styles.
    >
    >When moving from one item to another on the menu bar I want to
    >simulate the user clicking on the menu bar item they've just moved
    >onto, so the adjacent menu drops down automatically.
    >
    >So I have something like this:
    >
    >function MenuBarItemMouseover(menuBarItem)
    >{
    > menuBarItem.click();
    >}
    >
    >to simulate the user clicking on the adjacent menu.
    >
    >However it seems the previous menu bar item stays in the 'active'
    >state and the item that has been moved onto remains in the 'hover'
    >state.
    >
    >The css styles are defined in the order: link, visited, hover, active,
    >and in any case, it works fine if you actually do a mouse click on a
    >different menu bar item. It seems the programmatic click is not the
    >same.
    >
    >Is there anyway of forcing the previous link to 'normal' and the new
    >link to 'active' using JavaScript? Or is there some other way of
    >simulating a mouse click?
    Lazlo Woodbine, May 14, 2004
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    1
    Views:
    3,734
    =?Utf-8?B?Q293Ym95IChHcmVnb3J5IEEuIEJlYW1lcikgLSBN
    Sep 19, 2005
  2. Beatrice Rutger
    Replies:
    0
    Views:
    373
    Beatrice Rutger
    Jun 3, 2005
  3. John_Woo
    Replies:
    3
    Views:
    499
    Steve W. Jackson
    Jul 21, 2006
  4. Joshua Muheim
    Replies:
    5
    Views:
    121
    Phlip
    Aug 11, 2007
  5. iMath
    Replies:
    4
    Views:
    228
    iMath
    Sep 27, 2012
Loading...

Share This Page