<ul class="list">
<li>导航列表
<ul class="nav">
<li>导航列表1</li>
<li>导航列表1</li>
<li>导航列表1</li>
<li>导航列表1</li>
<li>导航列表1</li>
<li>导航列表1</li>
</ul>
</li>
<li>导航列表
<ul class="nav">
<li>导航列表2</li>
<li>导航列表2</li>
<li>导航列表2</li>
<li>导航列表2</li>
<li>导航列表2</li>
<li>导航列表2</li>
</ul>
</li>
</ul>

全局函数:

;(function($){
//全局
$.extend({
'nav':function(){
$('.nav').css({
'list-style':'none',
'margin':0,
'padding':0,
'display':'none'
}); $('.nav').parent().hover(function(){
$(this).find('.nav').slideDown('normal');
},function(){
$(this).find('.nav').stop().slideUp('normal');
});
}
}); //局部
$.fn.extend({
'nav':function(color){
$(this).find('.nav').css({
'list-style':'none',
'margin':0,
'padding':0,
'display':'none',
'color':color
}); $(this).find('.nav').parent().hover(function(){
$(this).find('.nav').slideDown('normal');
},function(){
$(this).find('.nav').stop().slideUp('normal');
}); return this;
}
});
})(jQuery);

执行:

$(function(){
//全局
$.nav();
//局部
$('.list').eq(1).nav('red');
});

jQuery自定义插件规范的更多相关文章

  1. fullpage的使用以及less, Sass的属性和JQuery自定义插件的声明和使用

    使用fullpage的步骤   1 导入JQuery.js fullpage,js fullpage.css 2 组建网页布局,最外层id="fullpage" 单页class=& ...

  2. 深入学习jQuery自定义插件

    原文地址:jQuery自定义插件学习 1.定义插件的方法 对象级别的插件扩展,即为jQuery类的实例增加方法, 调用:$(选择器).函数名(参数);      $(‘#id’).myPlugin(o ...

  3. jquery自定义插件——以 选项卡插件为例

    一直打算尝试自定义插件,终于付诸实践了,现在把内容发表出来,与大家共勉. 我是根据自己正在用的插件,模仿其源码,实现的自定义插件,完成之后,在网上看相关资料,对自定义插件部分,有了更明确的认识. jq ...

  4. jQuery自定义插件

    jQuery自定义插件 jQuery自定义插件按照功能分类,可以分为三类, 1>封装对象方法的插件,(也就是基于某个DOM元素的jQuery对象,局部的) 2>封装全局函数的插件,   ( ...

  5. 你的专属定制——JQuery自定义插件

        前  言 絮叨絮叨 jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计的宗 ...

  6. jQuery自定义插件--banner图滚动

    前言 jQuery是一个功能强大的库,提供了开发JavaScript项目所需的所有核心函数.很多时候我们使用jQuery的原因就是因为其使用插件的功能,然而,有时候我们还是需要使用自定义代码来扩展这些 ...

  7. JQuery自定义插件详解之Banner图滚动插件

      前  言 JRedu JQuery是什么相信已经不需要详细介绍了.作为时下最火的JS库之一,JQuery将其"Write Less,Do More!"的口号发挥的极致.而帮助J ...

  8. 代码:jquery自定义插件 demo

    jquery自定义插件 demo 2016-1-13 只是一个简易的示例 <script type="text/javascript" src="http://cd ...

  9. jquery自定义插件结合baiduTemplate.js实现异步刷新(附源码)

    上一篇记录了BaiduTemplate模板引擎使用示例附源码,在此基础上对使用方法进行了封装 自定义插件jajaxrefresh.js 代码如下: //闭包限定命名空间 (function ($) { ...

随机推荐

  1. 15 hbase 学习(十五)缓存机制以及可以利用SSD作为存储的BucketCache

    下面介绍Hbase的缓存机制:  a.HBase在读取时,会以Block为单位进行cache,用来提升读的性能 b.Block可以分类为DataBlock(默认大小64K,存储KV).BloomBlo ...

  2. Android 五大存储方式具体解释

    SharedPreferences与Editor SharedPreferences保存的数据仅仅要是类似于配置信息格式的数据.因此它保存的数据主要是简单的key-value对形式.以下关系图 上图全 ...

  3. hosts 文件与 ipv6

    ipv6 的项目地址:ipv6-hosts 正如文档中所说,用于在大陆地区加快 Google.YouTube.Facebook.Wikipedia 等的访问:(twitter 不支持) 使用说明(wi ...

  4. centos7 keepalive双机热备~

    简单实现Keepalive双击热备~ 摘要:准备两台虚拟机A:192.168.161.7  B:192.168.161.35  虚拟ip:192.168.161.10 keepalive进程 具体关于 ...

  5. 源码编译安装Nginx全程视频演示

    基本步骤: 1.首先停止现有web系统, #/etc/init.d/apache2 stop 2.将源码拷贝到/usr/local/src #cp /home/ditatompel/Public/Ng ...

  6. Chromium String usage

    For Developers‎ > ‎ Chromium String usage Types of StringsIn the Chromium code base, we use std:: ...

  7. LINUX中,find结合grep正则表达式,快速查找代码文件。

    ###目的###LINUX中,find结合grep正则表达式快速查找代码. 例如经常有需求:查找当前目录下所有.h文件中,"public开头,中间任意字符,以VideoFrameReceiv ...

  8. PHP 相关配置

    1. php-fpm的pool 编辑"php-fpm"配置文件"php-fpm.con" vim /usr/local/php/etc/php-fpm.conf ...

  9. 解决树莓派新版系统 ssh连接不了问题

    一.解决办法 由于有连接了显示器,所以可以直接输入命令行开启树莓派的SSH,并且使用putty连接就可以. sudo service ssh start sudo service ssh sttus ...

  10. Mysql学习总结(19)——Mysql无法创建外键的原因

    在MySQL中创建外键时,经常会遇到问题而失败,这是因为Mysql中还有很多细节需要我们去留意,我自己总结并查阅资料后列出了以下几种常见原因. 1.  两个字段的类型或者大小不严格匹配.例如,如果一个 ...