Zurb基金会手风琴 -

我使用该基金会3手风琴不倒闭不活动的部分：http://foundation.zurb.com/old-docs/f3/elements.php#accordion Zurb基金会手风琴 -

的默认行为是，当你点击一个选项卡来扩展部分，先前扩张部分坍塌。我想覆盖它，以便在第一部分展开的情况下加载页面，然后当您展开其他细分时，它们都保持打开状态。基本上，我想完全禁用折叠细分。

下面是相关的js。我试着只是“removeClass（‘无效’）替换所有的“removeClass（‘激活’）”的地方，但它似乎没有做任何事情。

;(function ($, window, undefined){ 
    'use strict'; 

    $.fn.foundationAccordion = function (options) { 

// DRY up the logic used to determine if the event logic should execute. 
var hasHover = function(accordion) { 
    return accordion.hasClass('hover') && !Modernizr.touch 
}; 

$(document).on('mouseenter', '.accordion li', function() { 
    var p = $(this).parent(); 

    if (hasHover(p)) { 
     var flyout = $(this).children('.content').first(); 

     $('.content', p).not(flyout).hide().parent('li').removeClass('active'); 
     flyout.show(0, function() { 
     flyout.parent('li').addClass('active'); 
     }); 
    } 
    } 
); 

$(document).on('click.fndtn', '.accordion li .title', function() { 
    var li = $(this).closest('li'), 
     p = li.parent(); 

    if(!hasHover(p)) { 
     var flyout = li.children('.content').first(); 

     if (li.hasClass('active')) { 
     p.find('li').removeClass('active').end().find('.content').hide(); 
     } else { 
     $('.content', p).not(flyout).hide().parent('li').removeClass('active'); 
     flyout.show(0, function() { 
      flyout.parent('li').addClass('active'); 
     }); 
     } 
    } 
    } 
); 

     }; 

    })(jQuery, this);

来源

2013-06-05 artmem

注释掉click侦听器内的线是从li元素删除active类如果您改变了主意，并希望允许部分通过再次单击关闭，只注释掉第二个见下图：。

$(document).on('click.fndtn', '.accordion li .title', function() { 
    var li = $(this).closest('li'), 
     p = li.parent(); 

    if(!hasHover(p)) { 
     var flyout = li.children('.content').first(); 

     if (li.hasClass('active')) { 
     //p.find('li').removeClass('active').end().find('.content').hide(); 
     } else { 
     //$('.content', p).not(flyout).hide().parent('li').removeClass('active'); 
     flyout.show(0, function() { 
      flyout.parent('li').addClass('active'); 
     }); 
     } 
    } 
    } 
);

来源

2013-06-05 21:52:08 chrisjsherm

对于那些谁不阅读像我这样的文档，Foundation 5包含此选项：http://foundation.zurb.com/docs/components/accordion.html并滚动到“Optional Ja vascript配置“。

在foundation.accordion.js中的设置对象中，将默认的”false“将multi_expand更改为”true“，您将可以轻松前往。

settings : { 
    active_class: 'active', 
    //multi_expand: false, 
    multi_expand: true, 
    toggleable: true, 
    callback : function() {} 
},

来源

2014-08-13 17:58:04

Zurb基金会手风琴 -

回答

相关问题