I have the following code to fade menu items and highlight the active
one. I can't get the active one thing to work.
I've searched a lot but could only find ways to add a class to the
anchor, and I would like to add the class to the li (cause the anchor
already has a class)

Here is my code

<script src="_js/jquery-1.2.6.min.js" type="text/javascript"
charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
    $(function () {
        if ($.browser.msie && $.browser.version < 7) return;

        $('#navigation li')
            .removeClass('highlight')
            .find('a')
            .append('<span class="hover" />').each(function () {
                    var $span = $('> span.hover', this).css('opacity',
0);
                    $(this).hover(function () {
                        // on hover
                        $span.stop().fadeTo(100, 1);
                    }, function () {
                        // off hover
                        $span.stop().fadeTo(100, 0);
                    });
                });

    });

</script>
<script type="text/javascript">
$(document).ready( function(){
        var path = location.pathname.substring(1);
        $('[EMAIL PROTECTED]"' + path + '"]').parents("li").addClass('active');
});
</script>

          <div id="navigatie">
            <ul id="navigation">
              <li class="highlight"><a href="beeldbank.html"
class="beeldbank"><span>beeldbank</span></a></li>
              <li class="highlight"><a href="huisstijl.html"
class="huisstijl"><span>huisstijl</span></a></li>
              <li class="highlight"><a href="index.html"
class="voorbeelden"><span>voorbeelden</span></a></li>
                        </ul>
         </div>



Any ideas how to set (or change) the class to the li?

Reply via email to