style sur un lien

**artotal** · 05/09/2007, 16h02

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**gKsam** · 05/09/2007, 17h44

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

<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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**artotal** · 06/09/2007, 12h51

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**gKsam** · 06/09/2007, 13h58

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

Dans le fichier CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**artotal** · 06/09/2007, 14h03

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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	
		}
 }

**gKsam** · 06/09/2007, 14h41

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

**artotal** · 06/09/2007, 14h53

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**gKsam** · 06/09/2007, 15h11

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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&nbsp;<b>&raquo;</b></a>
    </li>
    <li>
    	<a href="dossier.php?id_article=9">charte&nbsp;<b>&raquo;</b></a>
    </li>
    <li class="menu_actif">
    	<a href="dossier.php?id_article=12">notre méthode&nbsp;<b>&raquo;</b></a>
    </li>
    <li class="menu_actif">
    	<a href="dossier.php?id_article=13">espace client&nbsp;<b>&raquo;</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.

**artotal** · 06/09/2007, 15h49

d'ailleurs mon css débloque et moi je pousse un ouf de déséspoir.

**gKsam** · 06/09/2007, 18h03

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.

style sur un lien

JavaScript

Discussions similaires

Partager

Partager