So i just made this XSLT to use for a client website that i wanted to share with whoever might find it useful. I'm not that much into XSLT, so there might be more clever ways to do this, but it works.

Basically it consists of a stand alone "Home" link and then the other links generated through the Umbraco Backend. It has .current classes with images around those to make a nice rounding effect on the active link. Obviously this can be done with CSS 3.0, but i in this case i needed something more simple that was cross-browser compatible.

Used with Umbraco 4.7 and works with IE7 IE8 IE9 Firefox and Chrome.

Enjoy!

XSLT:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE xsl:stylesheet [
    <!ENTITY nbsp "&#x00A0;">
]>
<xsl:stylesheet
  version="1.0"
  xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
  xmlns:msxml="urn:schemas-microsoft-com:xslt"
  xmlns:umbraco.library="urn:umbraco.library"
  exclude-result-prefixes="msxml umbraco.library">

    <xsl:output method="xml" omit-xml-declaration="yes" />

    <xsl:param name="currentPage"/>

    <!-- Input the documenttype you want here -->
    <xsl:variable name="level" select="1"/>

<xsl:template match="/">      
    <ul class="topNavigation">
      <li class="topNavigationLi">
            <xsl:choose>
                <xsl:when test="$currentPage/@nodeName = 'Your homenode name'">
                 <img src="/css/gfx/topMenuSelectedLeftEnd.png" class="leftTip" />
                   <a href="default.aspx">               
                      <xsl:attribute name="class">current</xsl:attribute>         
                      Forside
                   </a>
                    <img src="/css/gfx/topMenuSelectedRightEnd.png" class="rightTip" />
             </xsl:when>
             <xsl:otherwise>
                 <a href="default.aspx">                               
                      Forside
                   </a>
                </xsl:otherwise>
            </xsl:choose>         
      </li>
       <xsl:for-each select="$currentPage/ancestor-or-self::* [@level=$level]/* [@isDoc and string(umbracoNaviHide) != '1']">
          <li class="topNavigationLi">      
              <xsl:choose>
                    <xsl:when test="@id = $currentPage/@id">
                        <img src="/css/gfx/topMenuSelectedLeftEnd.png" class="leftTip" />
                       <a href="{umbraco.library:NiceUrl(@id)}" class="current">
                           <xsl:value-of select="@nodeName"/>
                      </a>
                        <img src="/css/gfx/topMenuSelectedRightEnd.png" class="rightTip" />
                 </xsl:when>
                 <xsl:otherwise>
                     <a href="{umbraco.library:NiceUrl(@id)}">
                           <xsl:value-of select="@nodeName"/>
                      </a>
                    </xsl:otherwise>
                </xsl:choose>
           </li>
       </xsl:for-each>
 </ul>
</xsl:template>

</xsl:stylesheet>

CSS:

ul.topNavigation { clear:both; width:949px; height:25px; margin:0 0 0 0; padding:6px 0 0 11px; background:url(/css/gfx/topMenuBg.png) repeat-x; border:1px solid #666464; list-style-type:none; }  
      li.topNavigationLi { display:block; float:left; height:12px; margin:0 20px 0 0; padding:0 0 0 0; border:0; line-height:8px; /* Link-position-in-li crossbrowser fix */ }
          li.topNavigationLi a { display:block; margin:0; padding:5px 0 0 0; font-size:11px; color:white; text-transform:uppercase; text-decoration:none; border:0; }
               li.topNavigationLi a.current { display:block; float:left; height:17px; margin:0; padding:5px 5px 0 5px; background:url(/css/gfx/topMenuSelectedBg.png) repeat-x 0 top; border:0; }
                img.leftTip { float:left; display:block; margin:0; }
              img.rightTip { float:left; display:block; margin:0; }