(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. 理解js异步的概念

    js引擎在执行的时候是单线程的,这是大家都知道的.我们先来看一段代码: <html> <head> <meta http-equiv="Content-Type ...

  2. javascript的几种时间格式

    1.当前系统区域设置格式(toLocaleDateString和toLocaleTimeString) 例子:(new Date()).toLocaleDateString() + " &q ...

  3. C语言常用的库文件（头文件、函数库）

    C语言常用的库文件(头文件.函数库) C系统提供了丰富的系统文件,称为库文件.C的库文件分为两类,一类是扩展名为".h"的文件,称为头文件,在前面的包含命令中我们已多次使用过.在& ...

  4. zend studio 使用断点调试

    1, 下载 Xdebug 1 # 下载地址 2 # http://xdebug.org/download.php 3   4 # 寻找和自己所安装的 php 版本对应的 Xdebug 下载 5 # 对 ...

  5. 从头开发MUDLIB

    跟Akuma一起从头打造mudlib--[第一讲] 第一讲:让它跑起来注:每一讲我都会上传一个相符的lib,有些文件是旧的,有些是新的,我尽可能在lib里写清楚注释.更详细的内容则在每讲的正文里写. ...

  6. Oracle EBS-SQL (WIP-15):检查车间任务物料未发数量与现有量对照.sql

    select we.wip_entity_name                          任务号      ,mfg_lookups_wjs.meaning               作 ...

  7. 在Linux下sqlplus 登录时显示SID 和用户名

    一般显示为: SQL> show user USER 为 "SYS" SQL> 在 $ORACLE_HOME/sqlplus/admin目录下 编辑glogin.sql ...

  8. Cortex-M3和Cortex-M4 Fault异常应用之一 ----- 基础知识

    1. 摘要 Cortex-M内核实现了一个高效异常处理模块,可以捕获非法内存访问和数个程序错误条件.本应用笔记从程序员角度描述Cortex-M Fault异常,并且讲述在软件开发周期中的Fault用法 ...

  9. Delphi获取当前系统时间（使用API函数GetSystemTime）

    在开发应用程序时往往需要获取当前系统时间.尽管Y2K似乎已经平安过去,但在我们新开发的应用程序中还是要谨慎处理“时间”问题. 在<融会贯通--Delphi4.0实战技巧>(以下简称“该书” ...

  10. spring security执行流程图

    今天看到非常多人转载了这篇文章,这里备注一下.原文来自CSDN我的博客. 近期在研究spring security的配置,研究了一个星期了,在官网看了下.仅仅配置出来了简单的登录,但不知如何从数据库读 ...