(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 创建类和继承的几种方法

    在面向对象编程中,类(class)是对象(object)的模板,定义了同一组对象(又称"实例")共有的属性和方法.JavaScript语言里是没有类的概念的,但是我们通过以下方法也 ...

  2. UVA 1603 Square Destroyer

    题意: 给定一个火柴棒拼成的方格阵,然后去掉一些火柴棒,问至少再去掉几根火柴棒能够让图中一个正方形都没有. 思路: 1. 由于题目中给定了 n 的范围,2 * n * (n + 1) <= 60 ...

  3. MySQL导入sql 文件的5大步骤

    http://database.51cto.com/art/201005/200739.htm 以下的文章主要介绍的是MySQL导入sql 文件,即MySQL数据库导入导出sql 文件的实际操作步骤, ...

  4. RDLC报表系列(三) 总计和折叠

    继续接上一篇的内容,本文主要是简述总计和折叠 1.在Dept列右击,选择插入行->组内部下方(每个部门的Total),插入新的一行,并拆分单元格,然后合并列 3.设置文本框属性,格式为Total ...

  5. SQLServer 2008 R2 清空日志文件

    USE [master]GOALTER DATABASE FH2_SJH SET RECOVERY SIMPLE WITH NO_WAITGOALTER DATABASE FH2_SJH SET RE ...

  6. 初学Django

    纵然有众多大牛写过这些简单入门文章,但作为记录,还是要自己动手写下来的比较靠谱,‘好脑筋不如烂笔头’啊! Python 安装 Django本身是纯Python编写的,所以安装框架的第一步是确保你已经安 ...

  7. 2012年的MBP准备升级

    2012年买的MBP MD313要升级啦! 原因是4G内存在升级10.9巨浪后,无论是登录还是打开程序都比较慢,看内存使用使用基本上是满了,因此有了升级内存的想法. 首先想到的是看最大容量,16G,所 ...

  8. xml 解析 Xstream

    1.概述 json 解析可以使用gson包解为现成的对象,那么xml可以不可以用现成的包解析成java的对象呢? 带着这个问题,查询了一些材料找到了Xstream解析方法,确实可以完成这种思考,只是实 ...

  9. 5路数字量输入Di，5路大电流继电器输出，可电脑控制，支持modbus协议工业模块，支持和DCS,PLC无缝对接。

    数字量输入输出模块MRD-5060具有5路DI,5路继电器输出,1路485接口(支持Modbus RTU),能实现5路DI(干接点输入)转485的采集,也可以通过485控制5路继电器(5A30VDC, ...

  10. 论山寨手机与Android联姻 【10】SmartPhone的通信机制

    上一章我们说到,智能手机 == 电脑 + 移动网卡,这个提法比较粗略,更精准的提法应当是,智能手机的硬件结构分为应用程序处理器AP,和基带处理器BP两个部分.虽然AP部分的功能与电脑主板基本类似,但是 ...