Zébrer vos tableaux

Zébrer vos tableaux

Auteur du script : Mathieu Pillard. Merci :-)

De quoi s'agit-il ? Simplement de donner alternativement via javascript une couleur ou une autre aux lignes des tableaux de vos pages afin d'aider l'œil à se repérer et pour faire joli !

Il existe une technique disponible sur A List Apart, mais le script est basé sur un GetElementById. En conséquence, le script ne peut pas être utilisé si vous avez plusieuurs tableaux à zébrer.

Voici une version opérationelle d'un script pour zébrer un (des) tableau(x) :

function foo(couleur1, couleur2)
{
 var tables = document.getElementsByTagName("table");
 var len = tables.length;

 for (var i = 0; i < len; i++)
 {
  surligne(tables[i], couleur1, couleur2);
 }
}

function surligne(elm, couleur1, couleur2)
{
 var blen = elm.tBodies.length;
 
 for (var k = 0; k < blen; k++)
 {
  var n = elm.tBodies[k].rows.length;

  for (var i = 0; i < n; i++)
  {
   var len = elm.tBodies[k].rows[i].cells.length;
   
   for (var j = 0; j < len; j++)
   {
    elm.tBodies[k].rows[i].cells[j].style.backgroundColor = i % 2 ? couleur1 : couleur2;
   }   
  }
 } 
}
		

Script testé et approuvé par : IE 5 Win, IE 6 Win, Opera 7(.21), IE 5 Mac, Safari, FireBird/FireFox, Mozilla, Camino

Télécharger : tdcolor_ok.js

Voir : un exemple en ligne

---