Guest User

Untitled

a guest
Jun 19th, 2014
1,441
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 1.23 KB | None | 0 0
  1. Voici le code associé à mon tableau :
  2. <table class="table table-condensed tablesorter" id="results">
  3. <thead class="floating-header">
  4.    <tr>
  5.        <th>Nom</th>
  6.        <th>Âge</th>
  7.        <th>Pays</th>
  8.        <th>...</th>
  9.        <th>...</th>
  10.        <th>...</th>
  11.        <th>...</th>
  12.    </tr>
  13. </thead>
  14. <tbody>
  15.    <tr>
  16.        <td>Carmen</td>
  17.        <td>33 ans</td>
  18.        <td>Espagne</td>
  19.        <td>...</td>
  20.        <td>...</td>
  21.        <td>...</td>
  22.        <td>...</td>
  23.    </tr>
  24.    <tr>
  25.        <td>Michelle</td>
  26.        <td>26 ans</td>
  27.        <td>États-Unis</td>
  28.        <td>...</td>
  29.        <td>...</td>
  30.        <td>...</td>
  31.        <td>...</td>
  32.    </tr>
  33. </tbody>
  34. </table>
  35.  
  36. (qui contient en réalité une centaine de ligne)
  37. Et voici le code Javascript que j'ai utilisé pour fixer l'entête au top lors d'un scroll > 90px :
  38. $('#results thead').affix({
  39.             offset: {
  40.               top: 90
  41.             }
  42.         });
  43.        
  44. // Changement de la couleur de fond de l'entête du tableau au scroll
  45. $(window).scroll(function(){
  46.            if ($(this).scrollTop() > 90){
  47.                 $('#results thead').css('background-color','#EFEFEF');
  48.            }
  49.         });
  50.        
  51. $(".floating-header th").each(function() {
  52.       $(this).width($(this).width());
  53.  });
  54.         }
Advertisement
Add Comment
Please, Sign In to add comment