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

[Lazlo Woodbine]

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 MenuBarItemMous eover(menuBarIt em)
{
menuBarItem.cli ck();
}

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]

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 MenuBarItemMous eover(menuBarIt em)
{
menuBarItem.foc us();
menuBarItem.cli ck();
}

On 14 May 2004 11:00:10 -0700, sp********@yaho o.co.uk (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 MenuBarItemMous eover(menuBarIt em)
{
menuBarItem.cli ck();
}

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?