(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. oracle系统参数修改

    create pfile='/home/oracle/sss.ora' from spfile; create spfile from pfile='/home/oracle/sss.ora'; al ...

  2. zoj1074 To the Max

    题目很简单,求一个连续的最大子矩阵的值. zoj上的数据非常弱. 首先爆搜是O(N^4),10^8的复杂度略高,那么我们可以处理一下其中一维的前缀和,降一阶,然后按照连续最大子序列来处理,因为可能为负 ...

  3. hibernate中先建表还是先建实体类

    在实际工作中往往是先建表然后再生成类原因:建好数据库表之后往往要对数据表进行一些优化,比如说建索引,比如说建中间表,比如建视图.如果先建类的话这些优化是无法生成的

  4. Android 自定义EditText实现粘贴，复制，剪切的监听

    package com.dwtedx.qq.view; import android.annotation.SuppressLint; import android.content.Context; ...

  5. Gradle templates 的使用

    使用gradle 时有一些繁琐的创建工程 使用插件的步骤. 这些步骤可以使用一些gradle的模板来代替. 具体的操作步骤: 安装gradle: Prerequired: Java SDK insta ...

  6. 简单RTP发送类c++实现

    我之前编译了jrtplib 3.9.1,并且在项目中使用,结果发现在用这个库时,程序体积有增加了300多K,感觉实在是有点笨重,我无法就是用来发送rtp包而已.想想还是自己重新实现一个简单的类用用拉倒 ...

  7. 关于TCP封包、粘包、半包

    关于Tcp封包 很多朋友已经对此作了不少研究,也花费不少心血编写了实现代码和blog文档.当然也充斥着一些各式的评论,自己看了一下,总结一些心得. 首先我们学习一下这些朋友的心得,他们是: http: ...

  8. Protobuf从安装到配置整理帖 --转

    新做的Mini项目计划使用Google的Protobuf来做,关于Protobuf是什么玩意能干什么请自己去看这里:http://code.google.com/p/protobuf/ 这里讲一下安装 ...

  9. MYSQL 简单的循环存储过程

    BEGIN ; ; DO DO ); ; ) THEN ; END IF; END WHILE; ; ; END WHILE; END

  10. Cannot retrieve metalink for repository: epel.

    Error: Cannot retrieve metalink for repository: epel. Please verify its path and                     ...