[Resolu] Portes Coulissantes en CSS... multicolores !

Salut à tous,
J'essaie depuis quelques temps (déjà!) de faire des onglets multicolors en m'inspirant des "portes coulissantes" de Douglas Bowman (http://www.alistapart.com/articles/slidingdoors/).

Voici mes onglets : http://mistermedia.free.fr/site/onglets/test.html
Le fichier CSS : http://mistermedia.free.fr/site/onglets/test.css
Enfin, voici l'image utilisée : http://mistermedia.free.fr/site/onglets/onglets.png

J'aimerai définir une classe pour chaque couleur d'onglet de cette manière :
#header #violet en définissant par la suite les coordonnées de l'image (ex : -54px pour le violet, -81px pour le vert, etc...)
Ensuite je pense réintègrer tout ça dans mes balises <li id="violet"> (de la même manière que pour l'onglet "current").

Pourriez vous m'aider car je débute complètement, j'ai essayer de bidouiller mais à chaque coup ça s'est soldé par un échec

J'ai besoin de pistes pour continuer ...
A bientôt!
William.
Modifié par doubleyouti (15 Dec 2005 - 10:54)

bonsoir,
en me basant sur ton css, j'ai moifie, 2 3 petites choses.

1)

#header a:hover span {
	background:transparent;
    }

double emploi avec

2)

#header a:hover {
	background-position: 0 -54px;
    }

qui comme tu essaie de faire affiche bien avec -54px, un onglet violet, 0 -81px un onglet vert, etc ...
a plus


edit
et pour integrer ça dans les balises, c'est bien comme tu veut faire :

<li><a href="#" class="violet"><span>Hifi/Son</span></a></li>

et

#header a:hover.violet {
	background-position: 0 -54px;
    }

Modifié par gcyrillus (13 Dec 2005 - 22:08)

Merci gcyrillus!
Ca fonctionne à merveille
A bientôt!

William.

Vraiment interressant