jquery mobile menu vertical
Bonjour je suis dans mes phases de test.
Je cherche à construire un menu (style collapsibleset) verticale à gauche à 3 niveaux.
J'ai essayé ceci, le principe est bon mais le thème ne s'accorde pas.
Voici un mode reduit du code d'essai:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35
| <div data-role="page" data-theme="a" data-content-theme="a" id="left-panel" data-title="Panel fixed positioning" data-url="panel-fixed-page1">
<div data-role="header" data-position="fixed">
<h1> </h1>
<a href="#left-panel" data-icon="arrow-d-l" >Menu</a>
<a href="#idpanelconnect" data-icon="user" data-iconpos="notext">Add</a>
</div><!-- /header -->
<div data-role="footer" data-position="fixed"><h4> </h4></div><!-- /footer -->
</div>
<div data-role="panel" id="left-panel" data-position="left">
<ul data-role="listview">
<li data-icon="delete"><a href="#" data-rel="close">Fermer</a></li>
<li data-icon="back"><a href="#demo-intro" data-rel="back">Retour</a></li>
<li data-icon="home"><a href="#">Accueil</a></li>
<li data-role="collapsible" data-inset="false">
<h3>Objet 1</h3>
<ul data-role="listview">
<li data-role="collapsible" data-inset="false" data-iconpos="left">
<h3>Objet 1.1</h3>
<ul data-role="listview">
<li><a href="#">Objet 1.1.1</a></li>
<li><a href="#">Objet 1.1.2</a></li>
</ul>
</li><!-- /collapsible -->
<li data-role="collapsible" data-inset="false" data-iconpos="left">
<h3>Objet 1.2</h3>
<ul data-role="listview">
<li><a href="#">Objet 1.2.1</a></li>
</ul>
</li><!-- /collapsible -->
<li><a href="#">Objet 1.3</a></li>
</ul>
</li><!-- /collapsible -->
<li data-icon="home"><a href="#">Objet 2 (ainsi de suite)</a></li>
</ul>
</div> |
Merci d'avance pour vos remarques.