(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. jQuery Tags Input Plugin 插件的使用

    一个jquery开发的标签功能加强插件,可以生成或删除标签,还能对输入重复标签进行检查,和JQuery autocomplete插件配合实现自动完成功能. 官网:http://xoxco.com/pr ...

  2. UVa 821 Page Hopping

    题意: 给出一个有向图,求所有路径(两点间的最短路径)的平均值. 分析: 用floyd求两点间的最短距离,然后求平均就好. 代码: #include <iostream>#include ...

  3. 操作Sql数据库帮助类

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.D ...

  4. JS函数——作用域

    一 : 作用域的相关概念 首先看下 变量作用域 的概念:一个变量的作用域是程序源代码中定义这个变量的区域.————————<javascript权威指南>第六版全局变量拥有全局作用域,函数 ...

  5. android MVC理解

    算来学习Android开发已有2年的历史了,在这2年的学习当中,基本掌握了Android的基础知识.越到后面的学习越感觉困难,一来是自认为android没啥可学的了(自认为的,其实还有很多知识科学), ...

  6. hdu 4709 Herding hdu 2013 热身赛

    题意:给出笛卡尔坐标系上 n 个点,n不大于100,求出这些点中能围出的最小面积. 可以肯定的是三个点围成的面积是最小的,然后就暴力枚举,计算任意三点围成的面积.刚开始是求出三边的长,然后求面积,运算 ...

  7. 远程控制利器TeamViewer使用教程(图)

    TeamViewer是什么? 他是一款免费的可以穿透内网的远程控制软件,可以实现桌面共享,文件传送等功能,简单一点说就是和QQ远程协助一样,但是比QQ的远程协助功能更为强大. TeamViewer与木 ...

  8. Three.js学习笔记 – “我和小伙伴都惊呆了”的特效和Three.js初探

    什么是Three.js three.js是JavaScript编写的WebGL第三方库.提供了非常多的3D显示功能.Three.js 是一款运行在浏览器中的 3D 引擎,你可以用它创建各种三维场景,包 ...

  9. Scala基础入门-4

    Scala学习——类 简单类和无参方法 class Counter { private var value = 0 // 必须初始化字段 def increment() { value += 1 } ...

  10. 转载 java枚举类型enum的使用 (原文地址:http://blog.csdn.net/wgw335363240/article/details/6359614)

    java枚举类型enum的使用 最近跟同事讨论问题的时候,突然同事提到我们为什么java中定义的常量值不采用enmu枚举类型,而采用public final static 类型来定义呢?以前我们都是采 ...