- var accordion = {
- init: function(){
- var $container = $('#accordion');
- $container.find('li:not(:first) .details').hide();
- $container.find('li:first').addClass('active');
- $container.on('click','li a',function(e){
- e.preventDefault();
- var $this = $(this).parents('li');
- if($this.hasClass('active')){
- if($('.details').is(':visible')) {
- $this.find('.details').slideUp();
- } else {
- $this.find('.details').slideDown();
- }
- } else {
- $container.find('li.active .details').slideUp();
- $container.find('li').removeClass('active');
- $this.addClass('active');
- $this.find('.details').slideDown();
- }
- });
- }
- };
转自:http://www.iteye.com/news/28047
分享到:
相关推荐
这是一款炫酷的jquery水平手风琴折叠菜单效果。该jquery风琴折叠菜单效果以1870年为主题,在切换菜单项时带有幻影效果,并在整体上配以炫酷的文字动画效果。
jQuery动画手风琴折叠菜单栏代码是一款粉红色风格动态伸缩手风琴代码。
下面我们一起来看看如何实现这款漂亮的jQuery飘带式手风琴下拉菜单。 HTML代码 由于使用了bootstrap框架,因此其HTML结构也需要一致,代码如下: [......] 阅读全文>>
jQuery竖排动画手风琴折叠菜单栏代码是一款粉红色风格动态伸缩手风琴代码,展开一个另一个自动收缩。
CSS3+jQuery横向手风琴折叠效果.zip
jquery手风琴折叠式导航菜单特效,点击一级导航栏目展开显示二级导航菜单栏目,其他展开的栏目都关闭,只展开当前的导航菜单。折叠式的导航菜单比较适合用于网站的侧边分类的导航,节省空间又方便。
这是一款使用jQuery和css3制作的效果超酷的jQuery和css3垂直手风琴折叠菜单插件。该手风琴折叠菜单插件将css背景渐变、过渡、旋转等各种动画元素结合起来,形成效果非常酷的手风琴菜单。
jquery手风琴折叠式导航菜单特效,点击一级导航栏目展开显示二级导航菜单栏目,其他展开的栏目都关闭,只展开当前的导航菜单。折叠式的导航菜单比较适合用于网站的侧边分类的导航,节省空间又方便。
手风琴效果的应用非常广泛,我们常见的有手风琴图片切换和手风琴菜单,同时它也是焦点图的一种...3、jQuery手风琴式相册图片展开效果 之前我们有分享过很多jQuery手风琴样式的菜单,比如CSS3手风[......] 阅读全文>>
JQuery垂直可折叠手风琴菜单,每次只展开当前点击栏目的子菜单,会隐藏其他显示的子菜单,适合用于网站侧边栏菜单使用。
一款基于jQuery+Bootstrap手风琴折叠菜单代码,简洁扁平风格Bootstrap垂直手风琴菜单特效,切换时有动画效果。
html+jq+css手风琴(折叠效果)
jquery多种竖向展开折叠手风琴效果
jQuery竖排动画手风琴折叠菜单栏代码是一款粉红色风格动态伸缩手风琴代码,展开一个另一个自动收缩。
一款简单实用的jQuery垂直手风琴折叠下拉菜单代码,点击可以一级菜单可收缩展开二级子菜单,而且还有过渡动画效果。
jQuery手风琴垂直可折叠菜单代码 jQuery手风琴垂直可折叠菜单代码
jquery 手风琴插件 accordion折叠菜单完整版,有很多个菜单的示例。对学习相当有帮助。
jQuery动画垂直折叠导航效果