Hi,

I am designing a menu where when I mouseover the parent menu, its corresponding submenu gets displayed.

But the problem is whenever i mouseover any of the parent node, the child nodes of the 1st parent in the xml gets displayed.
Somehow the div that contains the child nodes always contain the child nodes of the 1st parent.

Menu.xsl:

<?xml version="1.0" encoding="utf-8"?>

<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="/">
<xsl:apply-templates select="MainMenu"/>
</xsl:template>

<xsl:template match="MainMenu">
<xsl:apply-templates select="item" mode="MainMenu"/>
</xsl:template>

<xsl:template match="item" mode="MainMenu">


<a class="MainMenuLink" >
<xsl:attribute name="href">
<xsl:value-of select="@url"/>
</xsl:attribute>
<xsl:attribute name="onmouseover_">
<xsl:if test="./SubMenu >
document.getElementById('HoverMenu').style.display ='block';
</xsl:if>
</xsl:attribute>
<xsl:value-of select="@label"/>
</a>

<xsl:if test="./SubMenu">
<div id="HoverMenu" >
<xsl:apply-templates select="SubMenu" />
</div>
</xsl:if>


</xsl:template>

<xsl:template match="SubMenu" >
<xsl:apply-templates select="item" mode="HoverMenu"/>
</xsl:template>

<xsl:template match="item" mode="HoverMenu">
<div id ="HoverMenuItem">
<a >
<xsl:attribute name="href">
<xsl:value-of select="@url"/>
</xsl:attribute>
<xsl:value-of select="@label"/>

</a>
</div>
</xsl:template>

</xsl:stylesheet>



menu.xml:
<?xml version="1.0" encoding="utf-8" ?>
- <MainMenu>
- <item label="Tutorial" url="default.aspx">
- <SubMenu>
<item label="HTML" />
<item label="XHTML" />
<item label="CSS" />
<item label="XML" />
<item label="XSL" />
</SubMenu>
</item>
<item label="Scripting" url="default.aspx" />
- <item label="Validation" url="default.aspx">
- <SubMenu>
<item label="JavaScript" />
<item label="VBScript" />
</SubMenu>
</item>
</MainMenu>

I wrote the following onmouseover____ document.getElementById('HoverMenu').style.display ='block'; where 'HoverMenu' is the div that contains the child nodes.
But when I mouseover any of the parent node , the 'HoverMenu'displays only the child nodes of 1st parent node.

Somehow the getElementById('HoverMenu') assigns the ID to all the parent menu.which should be unique . All my parent nodes (main menu) are dynamically generated from XML .

Please suggest how I can get the correct child nodes in 'HoverMenu' when I mouseover its corresponding parent menu.

I would recommend designing and debugging your HTML first, and then writing the XSLT to generate the HTML once you know that it works.

Your problem here looks like an HTML problem rather than an XSLT problem.

Michael Kay
http://www.saxonica.com/
Author, XSLT Programmer's Reference and XPath 2.0 Programmer's Reference