精心挑选的12款优秀的基于jQuery的手风琴效果插件和教程
更新时间：2012年08月22日 10:32:59 作者：
当你想在有限的页面空间内展示多个内容片段的时候，手风琴（Accordion）效果就显得非常有用，它可以帮助你以对用户非常友好的方式实现多个内容片段之间的切换。借助流行的 jQuery 框架，只需很少的代码就可以实现精美的手风琴效果，帮助你的网站吸引更多用户的眼球
当你想在有限的页面空间内展示多个内容片段的时候，手风琴（Accordion）效果就显得非常有用，它可以帮助你以对用户非常友好的方式实现多个内容片段之间的切换。借助流行的 jQuery 框架，只需很少的代码就可以实现精美的手风琴效果，帮助你的网站吸引更多用户的眼球。
Elegant Accordion with jQuery and CSS3
首先推荐的这款插件是基于 jQuery 和 CSS3 实现的优雅的鼠标悬停手风琴效果。
Vertical Sliding Accordion with jQuery
基于 jQuery 实现的垂直滑动的精美手风琴效果，可以通过箭头按钮进行切换。
Grid Accordion with jQuery
这个是很特别的网格（Grid）手风琴效果，融合了水平和垂直两种滑动方式。
Making accordion menu using jquery
非常简单的一个 jQuery 手风琴菜单效果，是学习手风琴效果的基本示例。
Horizontal JavaScript Accordion
这是另外一款水平的手风琴效果，可以用于实现文本、图片等内容的平滑切换。
A Simple and Beautiful jQuery Accordion Tutorial
这款插件非常简单，但是效果很不错，有非常细的制作过程供学习。
Horizontal jQuery Accordion
这个是在实际使用中的 jQuery 手风琴效果，实现基于点击模式的水平切换。
Simple Accordion with CSS and jQuery
效果不错的手风琴效果，可以用于实现内容片段间的平滑切换。
Create Accordions with CSS3, HTML5 and jQuery
结合 HTML5、CSS3 和 jQuery 实现的简洁风格的手风琴效果。
Making a Fresh Content Accordion
基于 jQuery 实现的非常时尚的手风琴效果，可以在项目中实际应用，也是学习的好例子。
jQuery Accordion Image Slider
常用的手风琴效果，水平方向的图片滑动，可以应用于实际项目中。
Flexible Slide-to-top Accordion
非常灵活的滑动至顶部手风琴效果，适合内容比较多的应用场合。
相关文章
这篇文章主要介绍了jQuery中trigger()与bind()用法,结合实例形式分析了trigger()与bind()的功能、定义及具体使用技巧,需要的朋友可以参考下2015-12-12
jQuery html表格排序插件tablesorter使用方法详解
这篇文章主要为大家详细介绍了jQuery html表格排序插件tablesorter的使用方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-02-02
这篇文章主要介绍了JQuery中queue方法用法,结合实例形式分析了queue方法操作函数队列相关技巧与注意事项,需要的朋友可以参考下2019-01-01
Jquery中request和request.form和request.querystring的区别
Request.Form是获取以POST方式提交的表单数据,Request.QueryString主要是获取地址栏参数或者以Get方式提交的数据,而Request则包含以上两种方式，会在Request.QueryString和Request.Form中都查询一遍变量2015-11-11
本文为大家介绍下使用jQuery UI 实现email输入提示，具体思路如下，感兴趣的朋友可以参考下2013-08-08
这篇文章主要介绍了jQuery实现标题有打字效果的焦点图代码,可实现幻灯片切换显示时标题同步逐个打印显示的效果,涉及jQuery操作json格式数据及时间函数的相关技巧,需要的朋友可以参考下2015-11-11
有时候我们需要读取JSON格式的数据文件，在jQuery中可以使用Ajax或者 $.getJSON()方法实现，下面有个不错的示例，需要的朋友可以参考下2013-11-11
使用Jquery搭建最佳用户体验的登录页面之记住密码自动登录功能（含后台代码）
今天将登录功能彻底完成，加入记住密码自动登录功能，密码在客户端进行第一次加密存储。并修改了一些bug，优化js代码，上一版本太乱了。2011-07-07
这篇文章主要和大家一起聊一聊如何实现easyui的datebox格式化的方法，感兴趣的小伙伴们可以参考一下2016-06-06
HTML文档的层次关系是树型的，每个标签可视为树的各个节点。若操作jQuery对象，使得HTML文档的结构发生了改变，就叫做文档处理2012-09-09
最新评论