如何做Foundation 6手風琴？

有人可以幫助我製作Foundation 6手風琴嗎？我基本上覆制並粘貼了文檔中的代碼，但它很混亂。我不知道我在這裏做錯了什麼。從文檔如何做Foundation 6手風琴？

HTML：

<ul class="accordion" data-accordion id="accordion"> 
    <li class="accordion-item is-active" data-accordion-item> 
    <a role="tab" href="#" class="accordion-title">Accordion 1</a> 
    <div class="accordion-content" data-tab-content role="tabpanel"> 
     Panel 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 
    </div> 
    </li> 
    <li class="accordion-item" data-accordion-item> 
    <a role="tab" href="#" class="accordion-title">Accordion 2</a> 
    <div class="accordion-content" data-tab-content role="tabpanel"> 
     Panel 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 
    </div> 
    </li> 
    <li class="accordion-item" data-accordion-item> 
    <a role="tab" href="#" class="accordion-title">Accordion 3</a> 
    <div class="accordion-content data-tab-content" role="tabpanel"> 
     Panel 3. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 
    </div> 
    </li> 
</ul>

由於代碼不工作，我檢查自己的網站，並添加東西像角色=「標籤」，並且在他們的代碼，而不是在一些數據 - *屬性文檔。

的Javascript：

// $(document).foundation(); 
var el = document.getElementById("accordion"); 
var elem = new Foundation.Accordion(el, options);

第一行註釋掉，因爲它沒有使用它（我只是自動假設，它始終是必需的），但它不是在文檔中提到，所以。我想這是多餘的？

我想查一些其他的SO答案在這裏，但他們讓我困惑甚至更多，這樣的：Foundation 6 Accordion Not Working

爲什麼使用2個jQuerys當時??的傢伙!! ??

這裏是不能正常工作手風琴的Codepen鏈接：http://codepen.io/lukasdinh/pen/dXXOwz

來源

2016-06-15 lukas

你在你的第三手風琴標籤

你有

<div class="accordion-content data-tab-content" role="tabpanel">

有一個錯字應該

<div class="accordion-content" data-tab-content role="tabpanel">

你的JavaScript只需要初始化基礎

$(document).foundation();

其他2線不需要

看到這個codepen

來源

2016-06-15 18:51:12 theCaveat

太感謝你了！ <3 – lukas

如何做Foundation 6手風琴？

回答

相關問題