Fundacja zwinąć listę
Gdy chcesz ukryć część wyświetlacza, można zwinąć listę.
Przykłady
<Li class = "akordeon-navigation ">
<A Href = "#demo"> Proste Składany </ a>
<Div id = "demo" class = "content">
Ten poradnik - nauka jest nie tylko technika, ale również sen! ! !
</ Div>
</ Li>
</ Ul>
<! - Inicjowanie Fundacja JS ->
<Script>
$ (Document) .ready (function () {
$ (Document) .foundation ();
})
</ Script>
Spróbuj »
Przykłady analityczne
.accordion klas i data-accordion atrybut jest używany do tworzenia składany element. .accordion-navigation klasy wykorzystywane do renderowania elementów składanego. Rzeczywista zawartość .content klasa (<div class = "content" ) i kliknij przycisk, aby wyświetlić albo.
Dodaliśmy do elementów listy <a> element sterujący (pokaż / ukryj) składanego. Następnie zakotwiczyć związek z treści składanego z tym samym identyfikatorem treści (<a href=#demo" 与<div id="demo"> związane).
Uwaga: Efekt składania musi być inicjowane Foundation JS.
Domyślnie składane treść jest ukryta. Możemy w <div> Poprzedni .active klasy dopuszcza się domyślne okno:
efekt Akordeon
Efekt Akordeon na rozbudowę i ustawić składanego treści.
Efekt Akordeon stosując wiele różnych kotwic i aby stworzyć link:
Przykłady
<Li class = "akordeon-navigation ">
<A Href = "#demo"> Akordeon instancji 1 </ a>
<Div id = class "demo" = "content aktywny">
Demo 1 - Tutorial - Nauka to nie tylko technologia, ale również sen! ! !
</ Div>
</ Li>
<Li class = "akordeon-navigation ">
<A Href = "# demo2"> instancji Akordeon 2 </ a>
<Div id = "demo2" class = "content">
Demo 2 - Lorem ipsum dolor sit amet ....
</ Div>
</ Li>
<Li class = "akordeon-navigation ">
<A Href = "# demo3"> instancji Akordeon 3 </ a>
<Div id = "demo3" class = "content">
Demo 3 - poradnik - nauka jest nie tylko technika, ale również sen! ! !
</ Div>
</ Li>
</ Ul>
Spróbuj »
Domyślnie akordeon posiada element listy jest otwarta. Jeśli chcesz, aby zamknąć wszystkie mogą korzystać z data-options="multi_expand:true;" ;" Właściwości:
Przykłady
..
</ Ul>
Spróbuj »