(function(){

     $.fn.YAccordion=function(options){

         var settings={

             trigger:'click',

             speed:300,

         };

         if(options)

             $.extend(settings,options);

         return this.each(function(){

             $("p",this).bind(settings.trigger,function(){

                 $(this).next("ul").slideToggle(settings.speed).siblings("ul").hide();

             });

             $("ul",this).hide().first().show();

         });

     }

 })();
 <!DOCTYPE html>

 <html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

 <meta http-equiv="Content-Language" content="zh-CN"/>

 <script type="text/javascript">

 </script>

 <style type="text/css">

 p{cursor:pointer;}

 </style>

 </head>

 <body>

 <div class="accordion">

     <p>第一栏</p>

     <ul>

         <li>aaaaaaaaa</li>

         <li>aaaaaaaaa</li>

         <li>aaaaaaaaa</li>

     </ul>

     <p>第二栏</p>

     <ul>

         <li>bbbbbbbbb</li>

         <li>bbbbbbbbb</li>

         <li>bbbbbbbbb</li>

     </ul>

     <p>第三栏</p>

     <ul>

         <li>ccccccccc</li>

         <li>ccccccccc</li>

         <li>ccccccccc</li>

     </ul>

 </div>

 <script src="../jquery-1.11.1.min.js" type="text/javascript"></script>

 <script src="jquery.yaccordion.js" type="text/javascript"></script>

 <script type="text/javascript">

     $(".accordion").YAccordion({speed:100});

 </script>

 </body>

 </html>

jquery插件anccordion的更多相关文章

  1. 自己写jquery插件之模版插件高级篇(一)

    需求场景 最近项目改版中,发现很多地方有这样一个操作(见下图gif动画演示),很多地方都有用到.这里不讨论它的用户体验怎么样. 仅仅是从复用的角度,如果每个页面都去写text和select元素,两个b ...

  2. JQuery插件定义

    一:导言 有些WEB开发者,会引用一个JQuery类库,然后在网页上写一写$("#"),$("."),写了几年就对别人说非常熟悉JQuery.我曾经也是这样的人 ...

  3. BootStrap_04之jQuery插件（导航、轮播）、以及Less

    1.列偏移与列排序: ①列偏移:控制列出现的位置,某列偏移后,后序列会随之偏移--只能右偏移: col-lg/md/sm/xs-offset-*; ②列排序:控制某一列的位置,该列可以左(pull)右 ...

  4. 锋利的jQuery--编写jQuery插件(读书笔记五)[完结篇]

    1.表单验证插件Validation   2.表单插件Form   3.动态事件绑定插件livequery 可以为后来的元素绑定事件   类似于jQuery中的live()方法     4.jQuer ...

  5. 2016年6月份那些最实用的 jQuery 插件专辑

    jQuery 是一个快速.流行的 JavaScript 库,jQuery 用于文档处理.事件处理.动画和 Ajax 交互非常简单,学习曲线也很平坦.2016年6月的 jQuery 插件专辑里,我们选择 ...

  6. 教你开发jQuery插件（转）

    教你开发jQuery插件(转) 阅读目录 基本方法 支持链式调用 让插件接收参数 面向对象的插件开发 关于命名空间 关于变量定义及命名 压缩的好处 工具 GitHub Service Hook 原文: ...

  7. Lazy Load, 延迟加载图片的 jQuery 插件.

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  8. JS原生ajax与Jquery插件ajax深入学习

    序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...

  9. jquery插件扩展的学习

    jquery插件的学习可以点击这里 举个例子 //首先先来一个插件 (function($){ $.fn.extent({ bigfont:function(){ return this.css('f ...

随机推荐

  1. PropertyGrid--基本功能

    一.引言 PropertyGrid是Visual Studio中新增的控件,顾名思义,其主要是用来显示和设置某一(或多个)对象的属性值的.其具体的实现主要是基于.Net中强大的反射机制.Propert ...

  2. javascript模式——Facade

    Facade模式为许多代码提供一个方便的接口,不现实代码实现的复杂性,这样,使用者只需要关心他的使用接口就可以使用. 下面来看一段Facade模式的运用,绑定事件在浏览器之间是不一样的,利用Facad ...

  3. 学习java的视频资源（尚学堂）（比较老旧，但是还是挺好用）

    本人新手,转入IT,一开始在学校的时候看过尚学堂 马士兵讲过的java基础视频教程,这次深入学习呢,就从百度云盘找了一整套的视频资源.之后越深入的学习呢,发现这些视频资源VeryCD上都发布了,地址 ...

  4. knockoutjs简单使用

    knockoutjs是一个不错的前端MVVM框架,极大的减轻了前端工作开发量,增加前端代码的维护性.主要特点:声明式绑定.依赖跟踪.模块开速开发. 如下代码(官方代码稍做修改) <p> 姓 ...

  5. JavaScript、jQuery获取页面及个元素高度、宽度

    Javascript获取获取屏幕.浏览器窗口 ,浏览器,网页高度.宽度的大小网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.client ...

  6. 一元云购qq互联回调地址错误解决办法

    经过追踪,点击登录后调用 system/modules/api/下面的qqlogin.action.class.php 里面又调用了qq 互联php接口样例里的QC.php的QC类的方法qq_logi ...

  7. Selenium2Library使用Remote功能（转载并更新）

    在selenium2library库的open browser中,除了我们常用的url,browser外,还有几个不常用的参数.如:remote_url的用法 1.下载selenium-server- ...

  8. vs2008调试 Release（链接器来生成调试信息）

    VS2008 Release 修改配置: 1.项目——>属性——>C/ C++ ——> 常规 ——>调试信息格式——>用于“编辑并继续”的程序数据库(/ZI) 2.项目— ...

  9. Buffer Cache（缓冲区缓存）篇：keep缓冲区池（保留池）

    Buffer  Cache可以有三个池 默认缓冲区池 keep缓冲区池 recycling缓冲区池 --保留池和回收池可以独立于sga中的其他缓存分配内存.创建表的时候可以在storage子句中使用b ...

  10. C语言的本质（5）——类型转换的本质与处理

    数据类型转换的方式 C 语言中的数据类型转换可分为隐式转换和显式转换两种. 隐式转换 隐式转换也可称作为自动转换,它经常以以下几种形式发生: 1.在计算一个同时出现多种数据类型的表达式时,将所有数据类 ...