style sur un lien

Version imprimable

style sur un lien

Bonjour,
j'essaie d'afficher un lien en blanc
Code:

1 2 3 4 5 if (isset ($_GET['id_article'])) { $lien=$_GET['id_article']; echo '<script>document.getElementById(\'actif'.$lien.'\').style.background="white";</script>'; } echo '<ul><li id="actif'.$lien.'">ssss</li></ul>';
la balise <li> m'affiche, mais j'ai surement un problème parceque le style n'est pas modifier ?

Code:

<script>document.getElementById('actif9').style.background="white";</script><ul><li id="actif9">ssss</li></ul>

05/09/2007, 17h44
gKsam

et comme ça

Des fois c'est tout bête et on y pense pas.

Quand une page est chargée, les script sont exécuté à la volée. Donc, dans ta ligne :

Code:

<script>document.getElementById('actif9').style.background="white";</script><ul><li id="actif9">ssss</li></ul>

Cela change la couleur (ici de fond) tu peux aussi utiliser backgroundColor. ton li n'a pas encore été créée. Donc il faut tout bêtement inverser les choses et hop cela marche.

Code:

<ul><li id="actif9">ssss</li></ul><script>document.getElementById('actif9').style.background="white";</script>

oui à la fin sa fonctionne l'ennui c'est que ma façon de faire ne fonctionne plus sur une boucle :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 function menu($rubrique) {
 		$req="SELECT id_article, description, page  FROM pages where rubrique='$rubrique'";
		$result = mysql_query($req);
		if (!$result)
		return false;
		if (isset ($_GET['id_article']))
			$lien=$_GET['id_article'];
		while($affiche = mysql_fetch_assoc($result)){
		echo '<li id="actif'.$lien.'">';
		echo '<a href="dossier.php?id_article='.$affiche['id_article'].'"';?> onMouseOver="return overlib('<?php echo addslashes($affiche['description']);?>', FGCOLOR, '#FC7A00', BGCOLOR, '#FFAE5F', BORDER, 1, CAPTIONFONT, 'arial', TEXTFONT, 'arial', TEXTSIZE, 0.7)" onmouseout="return nd();"><?php echo $affiche['page'];?>&nbsp;&raquo;</a>
		</li>
		<?php
                }
                ?>
				<script>document.getElementById('actif<?php echo $lien;?>').style.Color="yellow";</script>
		<?php
 }

Donc cette fois tous les liens ont le même id, ce qui est normel, mais y a t'il une métode propre de faire ce que je veux faire ?
Merci

06/09/2007, 13h58
gKsam

Ha ben oui mais là...
Pour moi le id est un identifiant. Donc il devrai être unique. D'ailleurs, si tu regarde la doc de getElementById() ici

Tu verras que getElementById ne renvoi qu'un seul élément. (je pense le premier)

Quand on veut faire de la mise en forme d'éléments dans un page. Le mieux c'est penser CSS et class.

Donc si tu mets la même class à tous tes <li> et que tu modifies le fichier css qui va avec le tour sera joué et en plus tu simplifieras ton code.

dans ton fichier HTML (ici dans tes echo PHP)

Code:

<ul><li class="nomClass">ssss</li></ul>

Dans le fichier CSS
Code:

1 2 3 4 5 li.nomClass { background : white; }

j'ai fait autrement :
Mais sa fonctionne toujours pas !

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 function menu($rubrique) {
 		$req="SELECT id_article, description, page  FROM pages where rubrique='$rubrique'";
		$result = mysql_query($req);
		if (!$result)
		return false;				
		while($affiche = mysql_fetch_assoc($result)){
		if (isset ($_GET['id_article']))
			$page_courante=$_GET['id_article'];
		if ($page_courante == $affiche['id_article'])
			$class= "menu_actif";
		echo '<li class='.$class.'>';
		echo '<a href="dossier.php?id_article='.$affiche['id_article'].'"';?> onMouseOver="return overlib('<?php echo addslashes($affiche['description']);?>', FGCOLOR, '#FC7A00', BGCOLOR, '#FFAE5F', BORDER, 1, CAPTIONFONT, 'arial', TEXTFONT, 'arial', TEXTSIZE, 0.7)" onmouseout="return nd();"><?php echo $affiche['page'];?>&nbsp;<span class="crochet_lien">&raquo;</span></a>
		</li>
		<?php	
		}
 }

06/09/2007, 14h41
gKsam

demande des sources HTML

Peux-tu poster bout de code HTML de ce ton code PHP fait. Et à quoi sert la fonction overlib() ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function menu($rubrique) {
         $req="SELECT id_article, description, page  FROM pages where rubrique='$rubrique'";
        $result = mysql_query($req);
        if (!$result)
        return false;                
        while($affiche = mysql_fetch_assoc($result)){
        if (isset ($_GET['id_article']))
            $page_courante=$_GET['id_article'];
        if ($page_courante == $affiche['id_article'])
            $class= "menu_actif";
        echo '<li class='.$class.'>';
        echo '<a href="dossier.php?id_article='.$affiche['id_article'].'"';?> onMouseOver="return overlib('<?php echo addslashes($affiche['description']);?>', FGCOLOR, '#FC7A00', BGCOLOR, '#FFAE5F', BORDER, 1, CAPTIONFONT, 'arial', TEXTFONT, 'arial', TEXTSIZE, 0.7)" onmouseout="return nd();"><?php echo $affiche['page'];?>&nbsp;<b class="crochet_lien">&raquo;</b></a>
        </li>
        <?php    
        }
 }

html renvoyer

Code:

1
2
3
4
5
6
7
8
9
10
11
               <ul><li class=""><a href="dossier.php?id_article=4" onMouseOver="return overlib('bla bla bla', FGCOLOR, '#FC7A00', BGCOLOR, '#FFAE5F', BORDER, 1, CAPTIONFONT, 'arial', TEXTFONT, 'arial', TEXTSIZE, 0.7)" onmouseout="return nd();">honoraires&nbsp;<b class="crochet_lien">&raquo;</b></a>
 
      </li>
      <li class=""><a href="dossier.php?id_article=9" onMouseOver="return overlib('bla bla bla', FGCOLOR, '#FC7A00', BGCOLOR, '#FFAE5F', BORDER, 1, CAPTIONFONT, 'arial', TEXTFONT, 'arial', TEXTSIZE, 0.7)" onmouseout="return nd();">charte&nbsp;<b class="crochet_lien">&raquo;</b></a>
      </li>
      <li class="menu_actif"><a href="dossier.php?id_article=12" onMouseOver="return overlib('bla bla bla', FGCOLOR, '#FC7A00', BGCOLOR, '#FFAE5F', BORDER, 1, CAPTIONFONT, 'arial', TEXTFONT, 'arial', TEXTSIZE, 0.7)" onmouseout="return nd();"> notre méthode&nbsp;<b class="crochet_lien">&raquo;</b></a>
      </li>
      <li class="menu_actif"><a href="dossier.php?id_article=13" onMouseOver="return overlib('bla bla bla', FGCOLOR, '#FC7A00', BGCOLOR, '#FFAE5F', BORDER, 1, CAPTIONFONT, 'arial', TEXTFONT, 'arial', TEXTSIZE, 0.7)" onmouseout="return nd();"> espace client&nbsp;<b class="crochet_lien">&raquo;</b></a>
 
      </li>
      </ul>

En faite à partir du moment ou il trouve la variable dans la boucle, il affiche la variable de la .class dans tout le reste se qui est logique !
Rolling Eyes
C'est la raison pour laquelle j'ai plusieurs .class dans mon menu
ps :) overlib c'est une librairie de popup

C'est ça que tu veux?

A copié dans une page HTML vide (enfin html, head, body) le minimum quoi.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 <style type="text/css"> body { background-color: #EEEEEE; } li.menu_actif { background: white; } </style> <ul> <li> <a href="dossier.php?id_article=4">honoraires <b>»</b></a> </li> <li> <a href="dossier.php?id_article=9">charte <b>»</b></a> </li> <li class="menu_actif"> <a href="dossier.php?id_article=12">notre méthode <b>»</b></a> </li> <li class="menu_actif"> <a href="dossier.php?id_article=13">espace client <b>»</b></a> </li> </ul>
c'est juste pour savoir si c'est ce résultat la que tu veux.

Personnellement, avant de passer au code PHP ou autre, je fait mon modèle en HTML et ensuite je l'intègre dans le code une fois que cela fonctionne comme je veux.

06/09/2007, 15h49
artotal

d'ailleurs mon css débloque et moi je pousse un ouf de déséspoir.
06/09/2007, 18h03
gKsam

quand le css débloque

quand le css ou le js débloque. Vides le cache du navigateur. Des fois ça marche.

Quand c'est comme ça, ce que je fait c'est que je refais ce que je voulais mais sans le code PHP. juste le HTML, CSS. Ensuite j'intègre le javascript et à la fin je fait généré le tout par PHP.

C'est un peu plus long mais au moins je ne debug pas du code javascript dans des echo PHP.