Adaptation de code JS

Version imprimable

Bonjour,

Voilà, j’ai trouvé ce code de JS sur le net et que je veux adapter à ce que je veux faire, donc aux lieux de faire tous automatique je veux faire en cliquent sur un bouton l’image se baisse et sur un autre bouton elle remonte, j’ai tenté de modifier sa mais je pence que le code et les variable son trais d’épandant, mais peut être quelle qu’un à une idée moi je ne suis qu’un novice.

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
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
53
54
55
56
57
58
59
60
61
62
63
64
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>Test</title>
<script type="text/javascript">
 
	window.attachEvent("onload", function() {
		var div = document.createElement('a');
		var id = 'saynotoie6_div';
		div.setAttribute('id',id);
		div.setAttribute('href','http://www.savethedevelopers.org/lang/fr/');
		div.setAttribute('target','_blank');
		div.style.display = 'block';
		div.style.color = '#1D1D1D';
		div.style.textAlign = 'left';
		div.style.fontFamily = 'Arial,sans-serif';
		div.style.fontSize = '11px';
		div.style.background = 'url(popDown.gif)';
		div.style.padding = '0';
		div.style.position = 'absolute';
		div.style.top = '0';
		div.style.right = '40px';
		div.style.zIndex = '999999';
		div.style.width = '330px';
		div.style.height = '63px';
		div.style.marginTop = '-80px';
		div.style.filter = 'alpha(opacity=95)';
		document.body.appendChild(div);
 
		var stdorg_animate = function() {
			var myDiv = document.getElementById(id);
			var value = parseInt(myDiv.style.marginTop);
			myDiv.style.marginTop = value + 1 + 'px';
			if (parseInt(myDiv.style.marginTop) < -1) {
			var timer = setTimeout(stdorg_animate, 30 * 80 / Math.abs(value) * .27);
			} /*else {
				var timer = setTimeout(stdorg_hide, 5000);
			}*/
		};
 
		var stdorg_hide = function(){
			var myDiv = document.getElementById(id);
			var value = parseInt(myDiv.style.marginTop);
			myDiv.style.marginTop = value - 1 + 'px';
			if (parseInt(myDiv.style.marginTop) > -80){
			var timer = setTimeout(stdorg_hide, 1.4 * 80 / Math.abs(value) * 3.70);
			}
		};
 
		setTimeout(stdorg_animate, 1000);
	});</script>
</head>
 
<body>
	<p>Bla bla bla</p>
<form action="#" name="formAN">	
<input name="dawn" type="button" onclick="" value="En Bas" />
<input name="up" type="button" onclick="" value="En haut"  />
</form>
</body>
</html>

Toutes les idées de comment modifier le code pour les besoins sera le bienvenu.

Merci d’avance.:roll::roll:

27/07/2009, 13h46
edenreal

je ne me suis pas trop plongé dans le code.
Mais est ce que ton image s'affiche?
Est ce normal que tes boutons n'on pas de fonction onclick?
Je ne vois pas l'interêt du forme si ce n'est peut être pour stocker les modification éffectuée, cependant je ne vois pas l'incrémention de leurs valeurs.

stdorg_hide et animated... tu désire la déplacer de maniere animé (j'imagine vu qu'il y à un timer)? En déplacant sur 1px....

Que veux tu faire au juste?

J'espere ne pas être trop a côté (fatigue quand tu nous tiens)

Personnelement je pense qu'il est plus interessant de créer ses fonctions sois même plûtot de que copier coller par paquet, surtout qu'il y à de plsu en plus de tuto bien foutut pour répondre a tout type de question. Par interessant j'entend : gain de savoir, gain de compréhension et bien souvent gain de temps

1 pièce(s) jointe(s)

Bonjour,

J’ai trouvé une solution tous bête (j’ai mis les variable en globale).

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
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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>Test</title>
<script type="text/javascript">
 
var stdorg_animate;
var stdorg_hide;
 
	window.attachEvent("onload", function() {
		var div = document.createElement('a');
		var id = 'saynotoie6_div';
		div.setAttribute('id',id);
		div.setAttribute('href','http://www.savethedevelopers.org/lang/fr/');
		div.setAttribute('target','_blank');
		div.style.display = 'block';
		div.style.color = '#1D1D1D';
		div.style.textAlign = 'left';
		div.style.fontFamily = 'Arial,sans-serif';
		div.style.fontSize = '11px';
		div.style.background = 'url(popDown.gif)';
		div.style.padding = '0';
		div.style.position = 'absolute';
		div.style.top = '0';
		div.style.right = '40px';
		div.style.zIndex = '999999';
		div.style.width = '330px';
		div.style.height = '63px';
		div.style.marginTop = '-80px';
		div.style.filter = 'alpha(opacity=95)';
		document.body.appendChild(div);
 
		stdorg_animate = function() {
			var myDiv = document.getElementById(id);
			var value = parseInt(myDiv.style.marginTop);
			myDiv.style.marginTop = value + 1 + 'px';
			if (parseInt(myDiv.style.marginTop) < -1) {
				var timer = setTimeout(stdorg_animate, 30 * 80 / Math.abs(value) * .27);
			} /*else {
				var timer = setTimeout(stdorg_hide, 5000);
			}*/
		};
 
		stdorg_hide = function(){
			var myDiv = document.getElementById(id);
			var value = parseInt(myDiv.style.marginTop);
			myDiv.style.marginTop = value - 1 + 'px';
			if (parseInt(myDiv.style.marginTop) > -80){
				var timer = setTimeout(stdorg_hide, 1.4 * 80 / Math.abs(value) * 3.70);
			}
		};
 
		//setTimeout(stdorg_animate, 1000);
	});
</script>
</head>
 
<body>
	<p>Bla bla bla</p>
<form action="#" name="formAN">	
<input name="dawn" type="button" onclick="setTimeout(stdorg_animate, 1000);" value="En Bas" />
<input name="up" type="button" onclick="setTimeout(stdorg_hide, 5000);" value="En haut"  />
</form>
</body>
</html>

Mais j’ai remarque qu’il y à rien qui ce passe avec Firefox je ne voix pas où est le problème,
Et aussi peut être qu’il existe une solution ou une idée pour firefox ?

Un grand Merci d’avance.

28/07/2009, 10h18
edenreal

Tu as surtout attribué une fonction à tes onclick ^^
Je viens de tester en copiant/collant bêtement ton code mais rien ne se passe.
Qu'est-il sensé ce passer?
28/07/2009, 19h33
bilred

Citation:

Envoyé par edenreal

Tu as surtout attribué une fonction à tes onclick ^^
Je viens de tester en copiant/collant bêtement ton code mais rien ne se passe.
Qu'est-il sensé ce passer?

Il faut mètre l’image du poste Prés-aidant la où la page html ce trouve.
Et la tu dois voir une l’image dé-sandre et remonter selon notre bon vouloir.

Attention :
Mais j’ai remarque qu’il y à rien qui ce passe avec Firefox je ne voix pas où est le problème, :mur:
Et aussi peut être qu’il existe une solution ou une idée pour firefox ?