probleme fonction mouseover

**maximew** · 12/02/2007, 15h32

Bonjour a tous,

J'ai crée un menu, avec 2 images: 1 etat normal, et une qui s'affiche lorsqu' il y a mouseover et lorsqu'il y a selection.

Mon problème est que les boutons restes sur l'etat mouseover meme si je clique sur une autre sous catégorie

voici les differente partie de code:

generation du menu:

Code :

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

1
2
3
4
5
6
7
8
9
10
 
function showbureauSubmenu($lSub) 
    { 
        if($lSub == 0) 
        { 
            $lSub = 1;     
        } 
 
        $sub = '<table width="576" border="0" cellspacing="0" cellpadding="0" height="27" style="margin-bottom:10px"> 
                    <tr height="27" style="background-image:url(./media/imgs/nav/bureau_back.jpg)">';

sous menu1:

Code :

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

1
2
3
4
5
6
7
 
$sub .= '<td width="78" height="27"> 
<td class="submenu" ' . ($lSub  != 1 ?'style="background-image:url 
(./media/imgs/nav/bureau_back_rol.jpg); text- 
align:center"' : 'onmouseover="this.style.background=\'url(./media/imgs/nav/bureau_back_rol.jpg)\'"  
onmouseout="this.style.background=this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)\'" style="text-align:center"' ) . '  
onclick="document.location=\'bureaux\'" ><nobr>1-BUREAUX</nobr></td>

sous menu2:

Code :

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

1
2
3
4
5
6
7
 
<td width="82" height="27"><td class="submenu" ' . ($lSub  != 
 2 ?'style="background-image:url(./media/imgs/nav/bureau_back_rol.jpg); text-align:center"' : 'onmouseover="this.style.background=\'url(./media/imgs/nav/bureau_back_rol.jpg)\'"  
onmouseout="this.style.background=this.style.background=\'url 
(./media/imgs/nav/bureau_back.jpg)\'" style="text-align:center"' ) . '  
onclick="document.location=\'caissons_pour_bureau\'" ><nobr>1- 
CAISSONS</nobr></td>

merci pour vos réponses

**E.Bzz** · 12/02/2007, 15h41

Bonjour,

Code :

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

onmouseout="this.style.background=this.style.background=\'url

Y a bégaiement, là, non ?

A+

**maximew** · 12/02/2007, 15h47

en effet lol...

c'est corrigé...mais ca ne marche toujours pas...

en fait quand je clique sous la sous categorie

la sous categorie1 s'affiche sur l'etat normal, et les autres s'affiche direct sur l'etat mouseover

et si je clique sur la sous categorie 2, la sous categorie 1 ne revient pas a l'etat normal

**E.Bzz** · 12/02/2007, 16h17

Visiblement, c'est que sous IE, parce que avec Firefox, ça donne ce que tu veux ...
Le menu "Manutention" a l'aire de fonctionner correctement : pourquoi tu reportes pas le code pour les autres ?

A+

**maximew** · 12/02/2007, 16h20

En fait je suis en train de le reprog, car manutention par exemple n'est pas optimisé pour l'url rewriting, et donc je dois changer ma source

et j'ai verifié la catégorie bureau ne marche pas non plus sur firefox....

**E.Bzz** · 12/02/2007, 16h33

Envoyé par maximew

et j'ai verifié la catégorie bureau ne marche pas non plus sur firefox....

Je maintiens

Quand j'arrive sur l'url ci-dessus, sous Firefox, le roll-over fonctionne mais uniquement sur "1-Bureaux".

Code :

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

 onmouseover="this.style.background='url(./media/imgs/nav/bureau_back_rol.jpg)'" onmouseout="this.style.background='url(./media/imgs/nav/bureau_back.jpg)'"

Normal : les onmouseover/onmouseout ne sont pas gérés sur les autres lignes ...

A+

**maximew** · 12/02/2007, 16h39

On avance lol...

en effet il y avait un problème sur l'affichage, reste encore un problème

si je clique sur l'une des sous catégorie toutes passe en mouseover et n'en change plus....

**maximew** · 12/02/2007, 16h55

je vous redonne le code telqu'il est actuellement:

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
27
function showbureauSubmenu($lSub)
    {
    	if($lSub == 0)
        {
            $lSub = 1;	
        }
 
    	$sub = '<table width="576" border="0" cellspacing="0" 
cellpadding="0" height="27" style="margin-bottom:10px">
                    <tr height="27" style="background-image:url
(./media/imgs/nav/bureau_back.jpg)">
 
					<td width="78" 
height="27"><td class="submenu" ' . ($lSub  != 1 ?'style="background-image:url(./media/imgs/nav/bureau_back_rol.jpg); text-
align:center"' : 'onmouseover="this.style.background=\'url
(./media/imgs/nav/bureau_back_rol.jpg)\'" 
onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)
\'" style="text-align:center"' ) . ' onclick="document.location=\'bureaux\'" ><nobr>1-BUREAUX</nobr></td>
 
                        <td style="width:1px; font-size:1px; 
background:#ffffff">&nbsp;</td>
 
 
                        <td width="82" height="27"><td class="submenu" ' . 
($lSub  != 1 ?'style="background-image:url
(./media/imgs/nav/bureau_back_rol.jpg); text-align:center"' : 'onmouseover="this.style.background=\'url(./media/imgs/nav/bureau_back_rol.jpg)\'" onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)\'" style="text-align:center"' ) . ' 
onclick="document.location=\'caissons_pour_bureau\'" ><nobr>2-CAISSONS</nobr></td>

**E.Bzz** · 12/02/2007, 16h59

Envoyé par maximew

si je clique sur l'une des sous catégorie toutes passe en mouseover et n'en change plus....

Hum ....
Ben là, tu changes de page

Et dans la page "Bureau", y a pas de onmouseover/onmouseout pour les roll-over du menu !

A+

**E.Bzz** · 12/02/2007, 17h35

Sur la page sur laquel on arrive (Mobilier Bureau) :

Code :

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

<td width="78" height="27"><td class="submenu" onmouseover="this.style.background='url(./media/imgs/nav/bureau_back_rol.jpg)'" onmouseout="this.style.background='url(./media/imgs/nav/bureau_back.jpg)'" style="text-align:center" onclick="document.location='bureaux'" ><nobr>1-BUREAUX</nobr></td>

Sur la page "Caissons" :

Code :

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

<td width="78" height="27"><td class="submenu" style="background-image:url(./media/imgs/nav/bureau_back_rol.jpg); text-align:center" onclick="document.location='bureaux'" ><nobr>1-BUREAUX</nobr></td>

1) Pas de onmouseover/onmouseout => pas de rollover
2) ton image de départ est celle du roll-over (bureau_back_rol.jpg)

C'est que du copié/collé ==> au taff'

A+

**maximew** · 12/02/2007, 17h41

la je pense que j'y suis presque...

mais c'est pas encore ca

pour mobilier j'ai mis ce code:

Code :

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

1
2
3
4
5
6
7
<td width="78" height="27"><td class="submenu" ' . ($lSub  != 
1 ?'onmouseover="this.style.background=\'url
(./media/imgs/nav/bureau_back_rol.jpg)\'" 
onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg);
 text-align:center"' : 'onmouseover="this.style.background=\'url(./media/imgs/nav/bureau_back_rol.jpg)\'" 
onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)\'" style="text-align:center"' ) . ' onclick="document.location=\'bureaux\'" 
><nobr>1-BUREAUX</nobr></td>

**E.Bzz** · 12/02/2007, 17h50

Sur la génération, je peux pas t'aider, mais visiblement tu traites différemment le 1° sous-menu dans les différents cas (ex : manutention, vestiaires etc.), à part pour Mobilier ...
Ca semble être le dernier pb à corriger

A+

**maximew** · 12/02/2007, 17h59

en fait ca marche pas ca genere un bug....

je te redonne une derniere fois le code complet, en tout cas merci pour ce que tu as deja fait...

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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
function showbureauSubmenu($lSub)
 
    {
    	if($lSub == 0)
 
        {
            $lSub = 1;	
        }
 
    	$sub = '<table width="576" border="0" cellspacing="0" 
cellpadding="0" height="27" style="margin-bottom:10px">
                    <tr height="27" style="background-image:url(./media/imgs/nav/bureau_back.jpg)">
 
 
					<td width="78" height="27"><td class="submenu" ' . ($lSub  != 1 ?'style="background-image:url(./media/imgs/nav/bureau_back_rol.jpg); text-align:center"' : 'onmouseover="this.style.background=\'url(./media/imgs/nav/bureau_back_rol.jpg)\'" onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)\'" style="text-align:center"' ) . ' onclick="document.location=\'bureaux\'" ><nobr>1-BUREAUX</nobr></td>
 
 
                        <td style="width:1px; font-size:1px; 
background:#ffffff">&nbsp;</td>
 
 
                        <td width="82" height="27"><td class="submenu" ' . ($lSub  != 1 ?'style="background-image:url
(./media/imgs/nav/bureau_back_rol.jpg); text-
align:center"' : 'onmouseover="this.style.background=\'url(./media/imgs/nav/bureau_back_rol.jpg)\'" 
onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)\'" style="text-align:center"' ) . ' 
onclick="document.location=\'caissons_pour_bureau\'" ><nobr>2-CAISSONS</nobr></td>
 
 
                        <td style="width:1px; font-size:1px; background:#ffffff">&nbsp;</td>
 
                        <td width="85" height="27"><td class="submenu" ' . ($lSub  != 1 ?'style="background-image:url
(./media/imgs/nav/bureau_back_rol.jpg); text-align:center"' : 'onmouseover="this.style.background=\'url(./media/imgs/nav/bureau_back_rol.jpg)\'"
 onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)\'" style="text-align:center"' ) . ' onclick="document.location=\'armoires\'" ><nobr>3-ARMOIRES</nobr></td>
 
						<td style="width:1px; font-size:1px; background:#ffffff">&nbsp;</td>
 
 
                        <td width="147" height="27"><td class="submenu" ' . ($lSub  != 1 ?'style="background-image:url(./media/imgs/nav/bureau_back_rol.jpg); text-align:center"' : 'onmouseover="this.style.background=\'url(./media/imgs/nav/bureau_back_rol.jpg)\'" onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)\'" style="text-align:center"' ) . ' onclick="document.location=\'fauteuils\'" ><nobr>4-SIEGES ET FAUTEUILS</nobr></td>
 
						<td style="width:1px; font-size:1px; background:#ffffff">&nbsp;</td>
 
 
                        <td width="103" height="27"><td class="submenu" ' . ($lSub  != 1 ?'style="background-image:url(./media/imgs/nav/bureau_back_rol.jpg); text-
align:center"' : 'onmouseover="this.style.background=\'url(./media/imgs/nav/bureau_back_rol.jpg)\'" onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)\'" style="text-align:center"' ) . ' onclick="document.location=\'accessoires_bureaux\'" ><nobr>5-ACCESSOIRES</nobr></td>
 
                        <td style="width:1px; font-size:1px; 
background:#ffffff">&nbsp;</td> ';
 
 
 
 
        return $sub;

merci

**E.Bzz** · 12/02/2007, 18h03

Envoyé par maximew

en fait ca marche pas ca genere un bug....

Ben comment c'est possible que ça fonctionne sur une page et pas les autres ?
Alors que la structure est la même ?

Bon courage, en tous cas ...

A+

**maximew** · 13/02/2007, 09h42

Il parait que la nuit porte conseille et c'est vrai!!!!

j'ai reussi ca marche enfin!!!!!

**E.Bzz** · 13/02/2007, 09h59

C'est rassurant

Mais ce qui aurait été intéressant, c'est de savoir pourquoi ça ne marchait pas hier ...

A+

**maximew** · 13/02/2007, 12h12

en fait, il fallait doubler la fonction mouseover, pour que quant on arrive sur la sous categorie elle fonctionne encore, donc voila l'ancien et le vieux code pour 1 seule sous catégorie ( ca suffit pour comprendre je pense)

ancien code:

Code :

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

1
2
3
4
5
6
7
<td height="27"><td class="submenu" ' . ($lSub  != 
1 ?'style="background-image:url(./media/imgs/nav/bureau_back_rol.jpg); text-
align:center"' : 'onmouseover="this.style.background=\'url
(./media/imgs/nav/bureau_back_rol.jpg)\'" 
onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)
\'" style="text-align:center"' ) . ' onclick="document.location=\'bureaux\'" 
><nobr>1-BUREAUX</nobr></td>

nouveau code:

Code :

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

1
2
3
4
5
6
7
8
<td height="27"><td class="submenu" ' . ($lSub  != 
1 ?'style="background-image:url(./media/imgs/nav/bureau_back.jpg)" 
onmouseover="this.style.background=\'url(./media/imgs/nav/bureau_back_rol.jpg)\'" 
onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)\'" style="text-align:center"' : 'onmouseover="this.style.background=\'url
(./media/imgs/nav/bureau_back_rol.jpg)\'" 
onmouseout="this.style.background=\'url(./media/imgs/nav/bureau_back.jpg)
\'" style="text-align:center"' ) . ' onclick="document.location=\'bureaux\'" 
><nobr>1-BUREAUX</nobr></td>

et voilou!!!

probleme fonction mouseover

JavaScript

Vue hybride

Discussions similaires

Partager

Partager