用jQuery扩展自写的 UI导航


Posted in Javascript onJanuary 13, 2010
(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)),小有成就感一把!
Javascript 相关文章推荐
SWFObject Flash js调用类
Jul 08 Javascript
使用javascript创建快捷方式的简单实例
Aug 09 Javascript
网页防止tab键的使用快速解决方法
Nov 07 Javascript
js实现弹出窗口、页面变成灰色并不可操作的例子分享
May 10 Javascript
jquery 追加元素append、prepend、before、after用法与区别分析
Dec 02 Javascript
JavaScript数组去重的6个方法
Jan 21 Javascript
浅析Angular2子模块以及异步加载
Apr 24 Javascript
JS实现带阴历的日历功能详解
Jan 24 Javascript
浏览器事件循环与vue nextTicket的实现
Apr 16 Javascript
简述vue-cli中chainWebpack的使用方法
Jul 30 Javascript
vue路由传参三种基本方式详解
Dec 09 Javascript
JS实现简易计算器
Feb 14 Javascript
jQuery的一些特性和用法整理小结
Jan 13 #Javascript
JavaScript关于select的相关操作说明
Jan 13 #Javascript
海量经典的jQuery插件集合
Jan 12 #Javascript
JQuery获取元素文档大小、偏移和位置和滚动条位置的方法集合
Jan 12 #Javascript
jquery下操作HTML控件的实现代码
Jan 12 #Javascript
jquery插件 cluetip 关键词注释
Jan 12 #Javascript
Javascript 实现TreeView CheckBox全选效果
Jan 11 #Javascript
You might like
一个用于mysql的数据库抽象层函数库
2006/10/09 PHP
php 防止单引号,双引号在接受页面转义
2008/07/10 PHP
PHP配置把错误日志以邮件方式发送方法(Windows系统)
2015/06/23 PHP
php实现点击可刷新验证码
2015/11/07 PHP
又拍云异步上传实例教程详解
2016/04/19 PHP
tp5框架前台无限极导航菜单类实现方法分析
2020/03/29 PHP
jQuery实现id模糊查询的小例子
2013/03/19 Javascript
使用jquery实现的一个图片延迟加载插件(含图片延迟加载原理)
2014/06/05 Javascript
JavaScript判断表单提交时哪个radio按钮被选中的方法
2015/03/21 Javascript
基于javascript实现漂亮的页面过渡动画效果附源码下载
2015/10/26 Javascript
jQuery实现两个select控件的互移操作
2016/12/22 Javascript
nodejs搭建本地服务器并访问文件的方法
2017/03/03 NodeJs
微信小程序 获取手机号 JavaScript解密示例代码详解
2020/05/14 Javascript
Python urllib、urllib2、httplib抓取网页代码实例
2015/05/09 Python
Python算法应用实战之队列详解
2017/02/04 Python
不同版本中Python matplotlib.pyplot.draw()界面绘制异常问题的解决
2017/09/24 Python
Python的numpy库中将矩阵转换为列表等函数的方法
2018/04/04 Python
Numpy 将二维图像矩阵转换为一维向量的方法
2018/06/05 Python
python实现画五角星和螺旋线的示例
2019/01/20 Python
解决python2 绘图title,xlabel,ylabel出现中文乱码的问题
2019/01/29 Python
Python实现PyPDF2处理PDF文件的方法示例
2019/09/25 Python
python NumPy ndarray二维数组 按照行列求平均实例
2019/11/26 Python
python可视化 matplotlib画图使用colorbar工具自定义颜色
2020/12/07 Python
HTML5离线应用与客户端存储的实现
2018/05/03 HTML / CSS
HTML利用九宫格原理进行网页布局
2020/03/13 HTML / CSS
Ramy Brook官网:美国现代女装品牌
2019/06/18 全球购物
公司请假条格式
2014/04/11 职场文书
服务承诺书范文
2014/05/19 职场文书
小学竞选班干部演讲稿
2014/08/20 职场文书
2014年项目经理工作总结
2014/11/24 职场文书
职位证明模板
2015/06/23 职场文书
大学社团活动总结怎么写
2019/06/21 职场文书
2019七夕节祝福语36句,快来收藏吧
2019/08/06 职场文书
Html分层的box-shadow效果的示例代码
2021/03/30 HTML / CSS
Pyhton爬虫知识之正则表达式详解
2022/04/01 Python
Python pyecharts案例超市4年数据可视化分析
2022/08/14 Python