sauvegarde exercice onglet

exemples/liste.json

@@ -8,5 +8,10 @@
   { "slug": "evenements-3-keyup", "title": "Evènements 3 : keyup" },
   { "slug": "ajax-requete-randomuserme", "title": "AJAX - Requête randomuser.me" },
   { "slug": "ajax-requete-themoviedborg", "title": "AJAX - Requête themoviedb.org" },
-  { "slug": "exercice-1-verifier-un-formulaire", "title": "Exercice 1 : vérifier un formulaire", "test": true }
+  {
+    "slug": "exercice-1-verifier-un-formulaire",
+    "title": "Exercice 1 : vérifier un formulaire",
+    "test": true
+  },
+  { "slug": "onglets", "title": "Onglets" }
 ]

exemples/onglets/contenu.html

@@ -0,0 +1,20 @@
+<ul id="onglets">
+    <li style="display:inline;">
+        <a id="onglet1" class="active" href="#onglet1">Onglet 1</a>
+    </li>
+    <li style="display:inline;">
+        <a id="onglet2" href="#onglet2">Onglet 2</a>
+    </li>
+    <li style="display:inline;">
+        <a id="onglet3" href="#onglet3">Onglet 3</a>
+    </li>
+</ul>
+<div class="panneau" id="panneau-onglet1">
+    <h2>Panneau 1</h2>
+</div>
+<div class="panneau" id="panneau-onglet2" style="display:none">
+    <h2>Panneau 2</h2>
+</div>
+<div class="panneau" id="panneau-onglet3" style="display:none">
+    <h2>Panneau 3</h2>
+</div>

exemples/onglets/script.js

@@ -0,0 +1,11 @@
+var onglets = $('#onglets li a');
+
+onglets.click(function(e) {
+    var link = $(this);
+    onglets.removeClass('active');
+    link.addClass('active');
+    var idLink = link.prop('id');
+    var idPanneau = "panneau-" + idLink;
+    $('.panneau').hide();
+    $('#' + idPanneau).show();
+});