[css] question idiote sur les listes

question idiote sur les listes [css] - HTML/CSS - Programmation

Marsh Posté le 29-11-2005 à 12:02:41    

Hello tout le monde,
 
Je me demandais s'il était possible  de spécifier en CSS de donner une image pour une liste simple, et un autre pour une liste contenant une sous-liste. Je m'explique :
 
<ul>
        <li>Recherche par mod&egrave;les</li>
        <li>Promotions</li>
        <li>T&eacute;l&eacute;phones mobiles</li>

        <li>Antennes
            <ul>
                <li>Antennes flash</li>
                <li>Boosters d'antennes</li>

            </ul>
        </li>
        ...
</ul>
 
Je voudrais qu'aux listes bleu soit associer un style, et aux rouge un autre, sans leur donner de classe (ou tout du moins de classe nommée).
Est-ce possible ?

Reply

Marsh Posté le 29-11-2005 à 12:02:41   

Reply

Marsh Posté le 29-11-2005 à 12:30:03    

Code :
  1. ul li
  2. {
  3. style pour la partie bleue
  4. }
  5. ul li ul li
  6. {
  7. style pour la partie bleue de la sous liste.
  8. }


 
Maintenant, si tu veux changer le style des li qui contiennent une sous liste, c'est plus compliqué, faut du DOM :)


---------------
http://www.alsacreations.com, http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net. A ne surtout pas prendre en exemple : http://www.worldinternet.be
Reply

Marsh Posté le 29-11-2005 à 12:31:15    

Roane a écrit :

Code :
  1. ul li
  2. {
  3. style pour la partie bleue
  4. }
  5. ul li ul li
  6. {
  7. style pour la partie bleue de la sous liste.
  8. }


 
Maintenant, si tu veux changer le style des li qui contiennent une sous liste, c'est plus compliqué, faut du DOM :)


 
Ah ^^  
C'est donc par le DOM qu'il faut passer... je me demande si le jeu en vaut la chandelle  :D  
 
Merci bien en tout cas  :wahoo:

Reply

Marsh Posté le 29-11-2005 à 16:52:04    

tu peux simplement en faisant :  

Code :
  1. var monmenu = document.getElementById("monmenu" );
  2. var mesLi = document.getElementsByTagName("LI" );
  3. for (var i=0;i<mesLi.length;i++) {
  4.   var Ulinside = mesLi[i].document.getElementsByTagName("UL" ).length;
  5.   if (Ulinside>0) then {
  6.     mesLi[i].class = "UnliquicontientunUL"
  7.   }
  8. }


 
en algo ca donne ca :  
 
je recupère le menu
je prend tous les LI du menu
boucle je fouille chaque LI
  je récupère tous les UL de chaque LI, et je regarde la taille du tableau de UL retourné
  Si le tableau de UL > 0, ca signifie qu'il y a au moins 1 UL dans le LI
  donc je rajoute une classe au LI
fin de la boucle "je fouille chaque LI"
 
oué c'est un algo pour enfant de maternelle :D

Reply

Marsh Posté le 29-11-2005 à 17:29:59    

gatsu35 a écrit :

tu peux simplement en faisant :  

Code :
  1. var monmenu = document.getElementById("monmenu" );
  2. var mesLi = document.getElementsByTagName("LI" );
  3. for (var i=0;i<mesLi.length;i++) {
  4.   var Ulinside = mesLi[i].document.getElementsByTagName("UL" ).length;
  5.   if (Ulinside>0) then {
  6.     mesLi[i].class = "UnliquicontientunUL"
  7.   }
  8. }


 
en algo ca donne ca :  
 
je recupère le menu
je prend tous les LI du menu
boucle je fouille chaque LI
  je récupère tous les UL de chaque LI, et je regarde la taille du tableau de UL retourné
  Si le tableau de UL > 0, ca signifie qu'il y a au moins 1 UL dans le LI
  donc je rajoute une classe au LI
fin de la boucle "je fouille chaque LI"
 
oué c'est un algo pour enfant de maternelle :D


 
Vivi, l'algo est simplissime, mais le fait de devoir passer par javascript me chagrine un tantinet :/

Reply

Marsh Posté le 29-11-2005 à 18:56:07    

ben rien t'emp^che de faire ca dans un fichier JS séparé :  
 
function ClassTheMenu(menuid) {
  var monmenu = document.getElementById(menuid);  
var mesLi = document.getElementsByTagName("LI" );  
for (var i=0;i<mesLi.length;i++) {  
  var Ulinside = mesLi[i].document.getElementsByTagName("UL" ).length;  
  if (Ulinside>0) then {  
    mesLi[i].class = "UnliquicontientunUL"  
  }  
}
}
 
windows.onload = function{
ClassTheMenu("identifiantdumenu" )
 
}
 
et ça tu le mets dans un JS à part
 
je sais, moi aussi j'aime pas faire appel à du JS Pour de l'affichage, mais ca m'amuse kan meme, on obtient de belles choses sans empêcher la navigation du site si le gars n'a pas JS, puisqu'ici, le JS est intrusif

Reply

Marsh Posté le 30-11-2005 à 15:57:02    

gatsu35 a écrit :

ben rien t'emp^che de faire ca dans un fichier JS séparé :  
 
function ClassTheMenu(menuid) {
  var monmenu = document.getElementById(menuid);  
var mesLi = document.getElementsByTagName("LI" );  
for (var i=0;i<mesLi.length;i++) {  
  var Ulinside = mesLi[i].document.getElementsByTagName("UL" ).length;  
  if (Ulinside>0) then {  
    mesLi[i].class = "UnliquicontientunUL"  
  }  
}
}
 
windows.onload = function{
ClassTheMenu("identifiantdumenu" )
 
}
 
et ça tu le mets dans un JS à part
 
je sais, moi aussi j'aime pas faire appel à du JS Pour de l'affichage, mais ca m'amuse kan meme, on obtient de belles choses sans empêcher la navigation du site si le gars n'a pas JS, puisqu'ici, le JS est intrusif


 
Je vais mettre ça dans un coin de ma tête pour utiliser le JS à bon escient... même si - brrrrrrrrr - ça me donne des frissons [:blacksunsoft]
 
En tout cas merci pour vos réponses malgré l'intitulé du thread :D

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed