联系我们
简单又实用的WordPress网站制作教学
当前位置:网站首页 > 网页前端技术 > 正文

用jQuery扩展自写的 UI导航 - Web前端

作者:98wpeu发布时间:2026-07-28分类:网页前端技术浏览:1


导读:复制代码代码如下:(function($){    $.navs=function(){        return$('#top_menu_bar>li').e...
复制代码 代码如下:
(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)),小有成就感一把!

标签:自写WebUIjQuery


网页前端技术排行
最近发表
网站分类
标签列表