用jQuery扩展自写的 UI导航_jquery

WBOY

Lepaskan： 2016-05-16 18:36:28

asal

1506 orang telah melayarinya

复制代码代码如下:

 
(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)），小有成就感一把！

Label berkaitan：

jquery

sumber：php.cn

Artikel sebelumnya：前淘宝前端开发工程师阿当的PPT中有JS技术理念问题_javascript技巧 Artikel seterusnya：jQuery Flash/MP3/Video多媒体插件_jquery

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel terbaru oleh pengarang