Discussion :

[mimagyc]

Bonjour,

je fait un menu dynamique , J'arrive a agrandir ca largeur, mais lorsque je veut le reduire, ca fonctionne pas ..

Voici le code:

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
 
function menu_mouse(id,sens) {
	timer = setInterval("menu('"+id+"','"+sens+"')",10);
}
 
function menu(id,sens) {
actuel = $(id).offsetWidth;
 
 
	if (sens == "+" && actuel<150) {
		suite = actuel+1;
		$(id).style.width = suite+"px";
	}
	else if (sens == "-" && actuel > 50)
	{
		suite = actuel-1;
		$(id).style.width = suite+"px";
	}
	else
	{
		clearInterval("timer");
	}
}

J'ai l'impression que le clearInterval("timer"); ne fonctionne pas .


Un lien : http://mimaro.free.fr/Eno2/

Merci.

[bigboomshakala]

Code :

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

clearInterval(timer)

[mimagyc]

Merci, mais j'ai encore un souci, mon menu s'elargie bien mais apres il ne se réduit pas .. je ne sait pas pourquoi:

voici le code dans la page html:

Code :

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

1
2
 
<li id="home" class="menu" onmousemove="menu_mouse('home','+')" onmouseout="menu_mouse('home','-')" style="width:50px;">Home&nbsp;&nbsp;</li>

Merci.

[mimagyc]

Si vous aller voir sur le lien, j'ai l'impression que lorsque l'on enlève la souris du "<li>" le bloc réduit et s'agrandit très vite, comme si le clearInterval(timer); ne fonctionnais pas .
et c'est même le cas, j'ai mis un alert comme ceci:

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
 
function menu_mouse(id,sens) {
	var timer = setInterval("menu('"+id+"','"+sens+"')",10);
}
 
function menu(id,sens) {
actuel = $(id).offsetWidth;
 
 
	if (sens == "+" && actuel<=150) {
		suite = actuel+1;
		$(id).style.width =suite+"px";
	}
	else if (sens == "-" && actuel >= 50)
	{
		suite = actuel-1;
		$(id).style.width =suite+"px";
	}
	else
	{
		clearInterval(timer);
		alert('marche');
	}
}

et je n'ai pas d'alert a s'afficher ...

merci.
PS: la console d'erreur de firefox : timer is not defined

Code :

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

1
2
3
4
5
 
	{
		clearInterval(timer);
		alert('marche');
	}

---------------------------------------------------

Voici mon denrier essai

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
 
function menu(id,sens) {
actuel = $(id).offsetWidth;
var actif = 1;
 
	if (actif == 1) {
 
	if (sens == "+" && actuel<150) {
		suite = actuel+1;
		$(id).style.width =suite+"px";
		var timer = setInterval("menu('"+id+"','"+sens+"')",10);
		actif = 1;
	}
	else if (sens == "-" && actuel > 60)
	{
		suite = actuel-1;
		$(id).style.width =suite+"px";
		var timer = setInterval("menu('"+id+"','"+sens+"')",10);
		actif = 1;
	}
	else
	{
		clearInterval(timer);
		actif = 0;
		alert('marche');
	}
	}
}

il m'affiche un alert en continue, le clearInterval(timer); ne fonctionne pas ...

merci.

[Bovino]

Normal, ta variable timer n'est pas globale, elle n'existe donc que dans la fonction menu_mouse(). Essaye comme ça :

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
var timer;
function menu_mouse(id,sens) {
	timer = setInterval("menu('"+id+"','"+sens+"')",10);
}
 
function menu(id,sens) {
actuel = $(id).offsetWidth;
 
 
	if (sens == "+" && actuel<=150) {
		suite = actuel+1;
		$(id).style.width =suite+"px";
	}
	else if (sens == "-" && actuel >= 50)
	{
		suite = actuel-1;
		$(id).style.width =suite+"px";
	}
	else
	{
		clearInterval(timer);
		alert('marche');
	}
}

[mimagyc]

En effet, ca fonctionne, mais je dois garder la souris sur la <li> pour qeu ca fonctionne, un simple passage ne suffit pas :http://mimaro.free.fr/Eno2/

eEt la souris dois bouger ... comment faire?

une petite mise a niveau du code :

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
 
var timer;
function menu_mouse(id,sens) {
	timer = setInterval("menu('"+id+"','"+sens+"')",10);
}
 
function menu(id,sens) {
actuel = $(id).offsetWidth;
 
 
	if (sens == "+" && actuel<150) {
		suite = actuel+1;
		$(id).style.width =suite+"px";
	}
	else if (sens == "-" && actuel > 50)
	{
		suite = actuel-1;
		$(id).style.width =suite+"px";
	}
	else
	{
		clearInterval(timer);
		//alert(actuel);
	}
}

HTML:

Code :

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

1
2
3
4
5
 
<li id="home" class="menu" onmousemove="menu_mouse('home','+')" onmouseout="menu_mouse('home','-')"style="width:60px;"><a href="index.php?action=home">Home&nbsp;&nbsp;</a></li>
<li id="jeu" class="menu" onmousemove="menu_mouse('jeu','+')" onmouseout="menu_mouse('jeu','-')" style="width:60px;">le jeu&nbsp;&nbsp;</li>
<li id="infos" class="menu" onmousemove="menu_mouse('infos','+')" onmouseout="menu_mouse('infos','-')" style="width:60px;">Infos&nbsp;&nbsp;</li>
<li id="forum" class="menu" onmousemove="menu_mouse('forum','+')" onmouseout="menu_mouse('forum','-')" style="width:60px;"><a href="forums/">Forum&nbsp;&nbsp;</a></li>

Merci.

PS : Plus d'erreur dans la console.