amélioration de l'exemple onglets

exemples/onglets/contenu.html

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

exemples/onglets/script.js

@@ -4,8 +4,7 @@ onglets.click(function(e) {
     var link = $(this);
     onglets.removeClass('active');
     link.addClass('active');
-    var idLink = link.prop('id');
-    var idPanneau = "panneau-" + idLink;
+    var idPanneau = link.data('panneau-id');
     $('.panneau').hide();
     $('#' + idPanneau).show();
 });

index.html

@@ -6,6 +6,7 @@
     <link rel="stylesheet" href="css/main.css">
     <link rel="stylesheet" href="css/qunit-2.4.1.css">
     <link rel="stylesheet" href="css/styles.css">
+    <link rel="stylesheet" href="css/bootstrap.min.css">
 <style type="text/css" media="screen">
 
 </style>