.

Zebrer un tableau CSS

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 reperer et pour faire joli !

Il existe une technique disponible sur A List Apart, mais le script est base sur un GetElementById. En consequence, le script ne peut pas ªtre utilise si vous avez plusieuurs tableaux   zebrer.

Voici une version operationelle d’un script pour zebrer 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 teste et approuve par : IE 5 Win, IE 6 Win, Opera 7(.21), IE 5 Mac, Safari, FireBird/FireFox, Mozilla, Camino

Telecharger : tdcolor_ok.js

Voir : un exemple en ligne

May 3, 2006 | Filed Under Internet 

Comments

Leave a Reply

You must be logged in to post a comment.