CSS tags problem Options
azzlack
Posted: Wednesday, September 10, 2008 10:56:36 PM

Rank: Devotee

Joined: 8/5/2007
Posts: 95
Location: Bergen, Norway
I have problem with my navigation code. I am trying to get a ul > li > ul > li multiple levels navigation. The problem is that with my code, the last li is being put into the 2nd last li when I click on the second last one. But when I click on any other li, the menu renders as normal.

You can see the problem for yourself at bergen.eyecatch.no
(try to click on "Om oss" and see how "Kontakt" changes to a higher level element, i.e. as a submenu of "Om oss".

I have the following code for my navigation:
Code:
<xsl:template name="menu">

    <xsl:param name="level"/>

        <xsl:if test="count($currentPage/ancestor-or-self::node [@level=$level]/node [string(data [@alias='umbracoNaviHide']) != '1']) &gt; '0'">
            <ul class="level_{@level}">
                <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=$level]/node [string(data [@alias='umbracoNaviHide']) != '1' and @nodeTypeAlias != 'Person']">
                    <li id="{@urlName}">
                        <h3>
                            <a href="{umbraco.library:NiceUrl(@id)}">
                                <xsl:if test="$currentPage/@id = current()/@id">
                                    <xsl:attribute name="class">Selected</xsl:attribute>
                                </xsl:if>
                                <xsl:attribute name="title">
                                    <xsl:value-of select="@nodeName"/>
                                </xsl:attribute>
                                <xsl:value-of select="@nodeName"/>
                            </a>
                        </h3>
                    <xsl:if test="$currentPage/ancestor-or-self::node/@id = current()/@id">
                        <xsl:call-template name="menu"><xsl:with-param name="level" select="$level+1"/></xsl:call-template>
                    </xsl:if>
                    </li>
                </xsl:for-each>
            </ul>
        </xsl:if>
</xsl:template>


www.eyecatch.no
leekelleher
Posted: Thursday, September 11, 2008 2:09:04 AM

Rank: Enthusiast

Joined: 5/28/2008
Posts: 45
Location: Bristol, UK
Hi azzlack,

As I'm not sure of your navigation structure, there's a bit of guess work from me.

Since the xsl:output method is set to "xml", any empty tags are being rendered as:

Code:
<ul class="level_3" />


Which is causing problems with certain browsers rendering the HTML/CSS!


From looking at your XSLT, there are different conditions in the xsl:if and xsl:for-each conditions.
i.e. the xsl:for-each is testing for "@nodeTypeAlias != 'Person'" (but the xsl:if isn't)

The quickest way to resolve this is to use the same condition:

Code:
<xsl:template name="menu">
    <xsl:param name="level"/>
    <xsl:if test="count($currentPage/ancestor-or-self::node [@level=$level]/node [string(data [@alias='umbracoNaviHide']) != '1' and @nodeTypeAlias != 'Person']) &gt; '0'">
        <ul class="level_{@level}">
            <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=$level]/node [string(data [@alias='umbracoNaviHide']) != '1' and @nodeTypeAlias != 'Person']">
                <li id="{@urlName}">
                    <h3>
                        <a href="{umbraco.library:NiceUrl(@id)}">
                            <xsl:if test="$currentPage/@id = current()/@id">
                                <xsl:attribute name="class">Selected</xsl:attribute>
                            </xsl:if>
                            <xsl:attribute name="title">
                                <xsl:value-of select="@nodeName"/>
                            </xsl:attribute>
                            <xsl:value-of select="@nodeName"/>
                        </a>
                    </h3>
                    <xsl:if test="$currentPage/ancestor-or-self::node/@id = current()/@id">
                        <xsl:call-template name="menu">
                            <xsl:with-param name="level" select="$level+1"/>
                        </xsl:call-template>
                    </xsl:if>
                </li>
            </xsl:for-each>
        </ul>
    </xsl:if>
</xsl:template>


Otherwise the <ul> tag is being rendered without any <li> tags.

Cheers,
- Lee

http://leekelleher.com/
azzlack
Posted: Thursday, September 11, 2008 8:23:38 AM

Rank: Devotee

Joined: 8/5/2007
Posts: 95
Location: Bergen, Norway
That fixed the problem!!

Thank you!

www.eyecatch.no
Users browsing this topic
Guest


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.