用jQuery扩展自写的 UI导航

复制代码 代码如下:
(function($){
    $.navs=function(){
        return $('#top_menu_bar > li').each(function(){
            $(this).hover(
                function(){
                    $(this).find('ul:eq(0)').show();
                },
                function(){
                    $(this).find('ul:eq(0)').hide();
                }
            );
        });
    };
})(jQuery);

上面是直接定义属性。下面是种常见的方法：
复制代码 代码如下:
jQuery.extend({
    navs:function(){
        return $('#top_menu_bar > li').each(function(){
            $(this).hover(
                function(){
                    $(this).find('ul:eq(0)').show();
                },
                function(){
                    $(this).find('ul:eq(0)').hide();
                }
            );
        });
    }
});

调用测试下：
$.navs();
两年前的野心今天终于实现了（噢，这是导航，不是页签(tabs)），小有成就感一把！

您可能感兴趣的文章:

• Jquery+CSS 创建流动导航菜单 Fluid Navigation
• jQuery-Easyui 1.2 实现多层菜单效果的代码
• jQuery EasyUI API 中文文档 - MenuButton菜单按钮使用介绍
• jQuery EasyUI API 中文文档 - Menu菜单
• jQuery实现的简洁下拉菜单导航效果代码
• jQuery实现类似标签风格的导航菜单效果代码
• jQuery实现下滑菜单导航效果代码
• jQuery实现的背景动态变化导航菜单效果
• jquery实现适用于门户站的导航下拉菜单效果代码
• jQuery ui实现动感的圆角渐变网站导航菜单效果代码