Question

我的页面中有js菜单，代码如下：

$(document).ready(function() {

    $("#topnav li").prepend("<span></span>"); //Throws an empty span tag right before the a tag

    $("#topnav li").each(function() { //For each list item...
        var linkText = $(this).find("a").html(); //Find the text inside of the <a> tag
        $(this).find("span").show().html(linkText); //Add the text in the <span> tag
    }); 

    $("#topnav li").hover(function() {  //On hover...
        $(this).find("span").stop().animate({
            marginTop: "-40" //Find the <span> tag and move it up 40 pixels
        }, 250);
    } , function() { //On hover out...
        $(this).find("span").stop().animate({
            marginTop: "0"  //Move the <span> back to its original state (0px)
        }, 250);
    });

});

如何为活动/当前链接/标签添加不同的样式？

感谢您的帮助！

Answer 1

这样做：

 <script type="text/javascript" charset="utf-8">
    //<![CDATA[
        jQuery(function() {
            jQuery('#topnav li').each(function() {
                var href = jQuery(this).find('a').attr('href');
                if (href === window.location.pathname) {
                    jQuery(this).addClass('current');
                }
            });
        });
    //]]>
 </script>

活动标签和js样式

1 个答案: