Javascript ? Qui fonctionne mais en fait non

**le.squal** · 21/01/2009, 20h47

Bonjour,

J'ai trouvé un code sur le net que j'ai adapter à mon site :
http://technopujades.free.fr/cortes/rub-faq.php

Tout fonctionne, lorsque l'on passe sur "descendre" ou sur "monter" le texte défile ...
Donc nikel !

Maintenant quand j'inclu ma rubrique faq dans le site ...
Il y a plus rien qui fonctionne ... ???

J'ai beau mettre le code script dans les balise head ou pas rien ne fonctionne !!!

Incomprehensible ?!

Si quelqu'un a une idée ?
Merci d'avance

Voici le code que j'ai utilisé,
visible a l'adresse suivante : http://technopujades.free.fr/cortes/index.php?rub=faq
Et à l'adresse suivante : http://technopujades.free.fr/cortes/index.php?rub=faq

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
 
<script type="text/JavaScript">
var sRepeat=null;
function doScrollerIE(dir, src, amount) 
	{	
		if (amount==null) 
			{
				amount=10
			}
		if (dir=="up") 
			{
				document.all[src].scrollTop-=amount
			}	
		else 
			{
				document.all[src].scrollTop+=amount
			}	
		if (sRepeat==null) 
			{
				sRepeat = setInterval("doScrollerIE('" + dir + "','" + src + "'," + amount + ")",100)
			}
		return false
	}
 
		window.document.onmouseout = new Function("clearInterval(sRepeat);sRepeat=null");
		window.document.ondragstart = new Function("return false");
 
function toggle( targetId )
	{
			target = document.all( targetId );
			if (target.style.display == "none")
				{
					target.style.display = "";
				} 
			else 
				{
					target.style.display = "none";
				} 	
	}
</script>
 
 
<table width="908" height="495" border="0" cellpadding="0" cellspacing="0">
  <tr>
 
    <td width="580" height="495" align="left" valign="top">
 
 
		<table width=580 height="450" border="0" cellpadding=0 cellspacing="0">
			<tr> 
				<td align="left" valign="top">
				<a onMouseOver="return doScrollerIE('up','faq1',20)" onMouseOut="clearInterval(sRepeat)" href="JavaScript:" class="lien">Monter</a>
			  	</td>
			</tr>
			<tr> 
				<td> 
					<div id=faq1 style="width: 580; height: 350; overflow: hidden;"> 
						<div align="justify">
						<?php							
						//connection a la base
						include "inc/connect.php";
 
						//Recupération de la rubrique
						$question = $_GET['question'];
 
						//selection
						if ($question == "ce")
							{	
								$rq = "select distinct id from tbl_faq where ce ='1' Order by id DESC";
							}
						elseif ($question == "employeur") 
							{	
								$rq = "select distinct id from tbl_faq where employeur = '1' Order by id DESC";
							}
						elseif ($question == "employe") 
							{	
								$rq = "select distinct id from tbl_faq where employe = '1' Order by id DESC";
							}
						else 
							{	
								$rq = 'select distinct id from tbl_faq Order by id DESC';
							}
 
						//recuperation des questions/reponses
						$result = mysql_query($rq) or die ("Affichage des faq impossible");
						while ($ligne = mysql_fetch_array($result))
							{
								extract($ligne);
								if ($id != "")
									{	
										$sql = "select titre, texte from tbl_faq where id='$id'";
										$req = mysql_query($sql) or die ("Affichage impossible");
										$data = mysql_fetch_array($req);
										$titre = $data['titre'];
										$texte = $data['texte'];
 
										echo '<p class="stitre">'.$titre.'</p>';
										echo '<p class="texte">'.$texte.'</p>';
									}
							}
 
						//fermeture de la connection SQL
						mysql_close();
						?>
						</div>
					</div>
				</td>
			</tr>
			<tr>
				<td align="left" valign="bottom">
				<a onMouseOver="return doScrollerIE('down','faq1',20)" onMouseOut="clearInterval(sRepeat)" href="JavaScript:" class="lien">Descendre</a>
				</td>
			</tr>
  	  </table>
 
 
	</td>
 
 
    <td width="328" height="495" align="right" valign="top">
 
	<p class="texte"><a href="<?php echo 'index.php?rub=faq&question=employe'; ?>" class="texte">Employ&eacute;</a></p>
    <p class="texte"><a href="<?php echo 'index.php?rub=faq&question=employeur'; ?>" class="texte">Employeur</a></p>
    <p class="texte"><a href="<?php echo 'index.php?rub=faq&question=ce'; ?>" class="texte">Ce</a></p>
 
	</td>
  </tr>
</table>

**SpaceFrog** · 22/01/2009, 09h46

Rappel ceci est un forum html/javascript ...

Commence par nous fournir le code html généré ...
On verra ensuite ce que l'on peut y faire ...

**jln13** · 22/01/2009, 11h04

Et installe firebug (firefox) tu as des erreurs javascript a l'url que tu as passe :

au chargement de la page :

Code :

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

1
2
3
4
 
a.box is null
[IMG]chrome://firebug/content/blank.gif[/IMG]var noobSlide=new Class({initialize:func....handles[this.currentIndex]:null))}}}});
_class.n...packed.js (ligne 1)

et quand tu passes sur "monter" :

Code :

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

1
2
3
4
5
 
 
document.all is undefined
[IMG]chrome://firebug/content/blank.gif[/IMG]				document.all[src].scrollTop-=amount
index.php?rub=faq (ligne 73)

bon debugage !

**EIN-LESER** · 22/01/2009, 11h15

document.all est déconseillé de toute façon non?

Pour des raisons d'accessibilité vaut mieux passer par document.getElementById

Je pense.

Si je me trompe merci de rectifier mes dires

**RomainVALERI** · 22/01/2009, 17h04

Envoyé par EIN-LESER

document.all est déconseillé de toute façon non?

Pour des raisons d'accessibilité vaut mieux passer par document.getElementById

Je pense.

Si je me trompe merci de rectifier mes dires

Tu ne te trompes pas : il est en effet déconseillé si l'on veut que son code javascript soit lisible pour un quelconque autre navigateur qu' Internet Explorer, seul à comprendre cet étrange "document.all" ^^ (ce qui est d'ailleurs à la base d'un hack encore très employé pour différencier IE et FF)

Définitivement : document.getElementById pour accéder à un élément de la page

**EIN-LESER** · 22/01/2009, 17h44

Tu me rassure

Je commencerais a douter de mes bases

Déjà qu'elles ne sont pas bien solides ( mes bases lol)

**le.squal** · 23/01/2009, 00h58

Déjà merci pour toutes vos réponses,
J'ai créer un fichier qui reprend vos remarques, bon maintenant il fort possible
que se soit faux, (d'ailleur c'est faut puisque sa fonctionne tjs pas) mais je n'ai aucune connaissance en javascript. Mais la en l'occurance je ne peux pas faire cet effet avec du php ...

J'ai regardé sur le net la syntaxe de : document.getElementById
qui est : document.getElementById("la variable")

J'ai aussi supprimer le code du "noobSlide" que je me sert dans une autre page (qui elle fonctionne) afin de ne pas cumuler les soucis ...

J'ai donc modifier le code en question, et j'ai tout enregistrer sur la page suivante :

http://technopujades.free.fr/cortes/index3.php

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Jacqueline Cortes - Avocate au barreau de Paris</title>
 
<!-- Chargement des css -->
<link href="css-js/texte.css" rel="stylesheet" type="text/css">
 
 
 
 
<!-- Chargement du defilement  -->
<script type="text/JavaScript">
var sRepeat=null;
function doScrollerIE(dir, src, amount) 
	{	
		if (amount==null) 
			{
				amount=10
			}
		if (dir=="up") 
			{
				document.getElementById("src").scrollTop-=amount
			}	
		else 
			{
				document.getElementById("src").scrollTop+=amount
			}	
		if (sRepeat==null) 
			{
				sRepeat = setInterval("doScrollerIE('" + dir + "','" + src + "'," + amount + ")",100)
			}
		return false
	}
 
		window.document.onmouseout = new Function("clearInterval(sRepeat);sRepeat=null");
		window.document.ondragstart = new Function("return false");
 
function toggle( targetId )
	{
			target = document.getElementById("targetId");
			if (target.style.display == "none")
				{
					target.style.display = "";
				} 
			else 
				{
					target.style.display = "none";
				} 	
	}
</script>
 
 
 
 
 
<?php
//---------------------------------------------------
//Recupération de la rubrique
//---------------------------------------------------
$rub = $_GET['rub'];
        
?>
 
 
<style type="text/css">
<!--
 
.fond_haut {
	background-image: url(img/frame/degrade.jpg);
	background-repeat: repeat-x;
	background-position: left top;
}
body {
	background-image: url(img/frame/font.jpg);
	margin : 0px 0px 0px 0px;
}
.fond_milieu {
	background-image: url(img/frame/milieu.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
 
-->
</style>
</head>
 
<body class="fond">
 
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
  <tr > 
    <td height="670" class="fond_haut" >&nbsp;</td>
	<td width="908" height="670" align="center" valign="top" class="fond_milieu">
 
	<table width="908" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="908" height="30" align="center" valign="top">&nbsp;</td>
      </tr>
      <tr>
        <td width="908" height="510" align="center" valign="top">
 
 
 
	<table width="908" height="495" border="0" cellpadding="0" cellspacing="0">
  	<tr>
 
    <td width="580" height="495" align="left" valign="top">
 
 
		<table width=580 height="450" border="0" cellpadding=0 cellspacing="0">
			<tr> 
				<td align="left" valign="top">
				<a onMouseOver="return doScrollerIE('up','faq1',20)" onMouseOut="clearInterval(sRepeat)" href="JavaScript:" class="lien">Monter</a>
			  	</td>
			</tr>
			<tr> 
				<td> 
					<div id=faq1 style="width: 580; height: 350; overflow: hidden;"> 
						<div align="justify">
						<?php                                                   
//code php ... pour afficher le texte
?>
						</div>
					</div>
				</td>
			</tr>
			<tr>
				<td align="left" valign="bottom">
				<a onMouseOver="return doScrollerIE('down','faq1',20)" onMouseOut="clearInterval(sRepeat)" href="JavaScript:" class="lien">Descendre</a>
				</td>
			</tr>
  	  </table>
 
 
	</td>
 
 
    <td width="328" height="495" align="right" valign="top">
 
	<p class="texte"><a href="<?php echo 'index.php?rub=faq&question=employe'; ?>" class="texte">Employ&eacute;</a></p>
    <p class="texte"><a href="<?php echo 'index.php?rub=faq&question=employeur'; ?>" class="texte">Employeur</a></p>
    <p class="texte"><a href="<?php echo 'index.php?rub=faq&question=ce'; ?>" class="texte">Ce</a></p>
 
	</td>
  </tr>
</table>
 
 
 
		</td>
      </tr>
      <tr>
        <td width="908" align="right" valign="top">
 
		  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
		codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" 
		width="730" height="110" title="menu Jacqueline Cortes">
          <param name="movie" value="menu/menu.swf" />
          <param name="quality" value="high" />
          <embed src="menu/menu.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="730" height="110">		  		  </embed>
        </object>
 
		</td>
      </tr>
    </table>
	</td>
	<td height="670" class="fond_haut">&nbsp;</td>
  </tr>
</table>
 
</body>
</html>

**RomainVALERI** · 23/01/2009, 02h00

Ce n'est pas tout-à-fait ça pour ton getElementById : le paramètre attendu entre parenthèses doit être une chaine, et la fonction recherche l'unique (en principe, si ta page est bien construite) élément (c'est-à-dire une balise) comportant une propriété "id" ayant pour valeur la chaine recherchée.

Conclusion : en faisant

Code javascript :

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

document.getElementById("src").scrollTop-=amount

, tu cherches l'élément dont l'ID est "src", et il n'y en a aucun. ^^
En revanche, tu peux retirer les guillemets pour obtenir

Code javascript :

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

document.getElementById(src).scrollTop-=amount

, ce qui permet d'utiliser le second paramètre de ta fonction, qui je suppose, contient une chaine correspondant à l'ID de l'élément à faire scroller...

**EIN-LESER** · 23/01/2009, 09h30

Autrement dit:

Pour pouvoir faire sa:

Code :

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

1
2
3
4
 
 
 
<script type="text/javascript">document.getElementById('mom_paragraph');</script>

Tu dois avoir dans ta page quelque chose ressemblant a sa:

Code :

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

1
2
3
 
 
<p id="mom_paragraph"></p>

**le.squal** · 23/01/2009, 11h23

Je suis au boulot donc la impossible pour moi de modifier le fichier afin de mettre le src sans les guillemets.
Sinon j'ai effectivement un id dans ma page html

Non pas sous la forme de :
<p id="mom_paragraph"></p>

Mais en utilisant un div :
<div id=faq1 style="width: 580; height: 350; overflow: hidden;">

Je pense que cela n'a pas d'importance.

Mais se que je comprend pas, c'est pourquoi lorsque j'affiche le fichier de la rubrique seul tout fonctionne.
Et pourquoi quand j'inclu mon fichier rubrique dans le site, la rubrique ne fonctionne plus ... ?
La lecture du javascript ce fait autrement, les valeurs des variables diffèrent ... ?

Affichage rubrique seule (sans css du coup) :
http://technopujades.free.fr/cortes/rub-faq.php

Affichage complet :
http://technopujades.free.fr/cortes/index.php?rub=faq

**EIN-LESER** · 23/01/2009, 11h36

que ton id soit définit pour un <p>, div, input ou autre est sans importance.

une id se contente de repérer une balise quelle qu'elle soit.

Pour les deux liens que tu a mis, il est normal que le scroll ne marche pas

Le texte est affiché en intégralité donc il y a rien a scroller lol

essaye de réduire la taille de ton affichage du texte.

**le.squal** · 23/01/2009, 15h18

Je suis d'accord avec toi sur le fait que le texte soit afficher en intégralité.
Justement, mon soucis c'est qu'il est scrollé dans un cas et pas dans l'autre ... alors que c'est exactement le meme fichier.

J'inclu le 1er lien dans la page index.php (2eme lien)

Pourquoi dans un cas ca fonctionne et pas dans l'autre ... ??? Impossible de trouver ...

Par contre je modifie dessuite le fichier en fonction des " et ' ...

**le.squal** · 23/01/2009, 15h41

Je viens de faire les modifs ...

Et pas d'amélioration ... le fichier rub-faq.php ouvert seul fonctionne. Et pas si je l'inclu dans le index.php ...

??!? ... snif ...

**le.squal** · 25/01/2009, 19h07

J'ai beau chercher faire des tests, supprimer, renomer ... sa fonctionne tjs pareil : nikel dans la rub-faq.php
Et ne fonctionne pas si je l'inclu dans la page index.php ... ?

**EIN-LESER** · 26/01/2009, 11h13

ton code est le même dans les deux cas mais quelque chose doit différer c'est obligé.

Vérifies ton code css donne au paragraphe dans le que tu mets ton texte une taille max et min dans le css et vois ce que sa te donne.

**le.squal** · 26/01/2009, 22h02

Bon alors je viens au news, soulagé !
Je suis parti de ta remarque, et j'ai commencer par supprimer tout les fichiers que j'inclué (je l'avais déja fais ... mais bon, je me suis dit on sais jamais j'ai du en rater un ...) bon c'était pas ca. Pas de soucis css donc.
Puis j'ai continué a supprimer toute les différences par rapport a mon fichier original (modifier au passage par toutes vos remarques) que je met a dispo. si il vous intéresse.
Au final le soucis vient des lignes suivantes :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Remplacées simplement par :
<html>

Le fichier original (trouvé sur le net et modifié par vos remarques successives) :

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
 
 
var sRepeat=null;
function doScrollerIE(dir, src, amount) 
	{	
		if (amount==null) 
			{
				amount=10
			}
		if (dir=="up") 
			{
				document.getElementById(src).scrollTop-=amount
			}	
		else 
			{
				document.getElementById(src).scrollTop+=amount
			}	
		if (sRepeat==null) 
			{
				sRepeat = setInterval("doScrollerIE('" + dir + "','" + src + "'," + amount + ")",100)
			}
		return false
	}
 
		window.document.onmouseout = new Function("clearInterval(sRepeat);sRepeat=null");
		window.document.ondragstart = new Function("return false");
 
function toggle( targetId )
	{
			target = document.getElementById(targetId);
			if (target.style.display == "none")
				{
					target.style.display = "";
				} 
			else 
				{
					target.style.display = "none";
				} 	
	}

Le tout :

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
 
<html>
 
<head>
<title>Scripts Javascript : Aperçu</title>
 
<SCRIPT>
 
var sRepeat=null;
function doScrollerIE(dir, src, amount) 
	{	
		if (amount==null) 
			{
				amount=10
			}
		if (dir=="up") 
			{
				document.getElementById(src).scrollTop-=amount
			}	
		else 
			{
				document.getElementById(src).scrollTop+=amount
			}	
		if (sRepeat==null) 
			{
				sRepeat = setInterval("doScrollerIE('" + dir + "','" + src + "'," + amount + ")",100)
			}
		return false
	}
 
		window.document.onmouseout = new Function("clearInterval(sRepeat);sRepeat=null");
		window.document.ondragstart = new Function("return false");
 
function toggle( targetId )
	{
			target = document.getElementById(targetId);
			if (target.style.display == "none")
				{
					target.style.display = "";
				} 
			else 
				{
					target.style.display = "none";
				} 	
	}
</SCRIPT>
</head>
<body>
 
 
<table width=130 cellpadding=0 cellspacing="0" border="1" bordercolorlight="#3366cc" bordercolordark="#99ccff">
 <tr> 
	<td onMouseOver="this.style.backgroundColor='#ffcc00';" onMouseOut="this.style.backgroundColor='';">
	<a onMouseOver="return doScrollerIE('up','faq1',2)" onMouseOut="clearInterval(sRepeat)" href="JavaScript:">Monter</a>
	</td>
 
</tr>
<tr> 
	<td> 
	<div id=faq1 class=sc1 style="width: 130; height: 100; overflow: hidden;"> 
	<font face="Verdana" size="2">
	<div align="center">
	<a href="JavaScript:">Lien N°1</a><br>
	<a href="JavaScript:">Lien N°2</a><br>
	<a href="JavaScript:">Lien N°3</a><br>
	<a href="JavaScript:">Lien N°4</a><br>
	<a href="JavaScript:">Lien N°5</a><br>
	<a href="JavaScript:">Lien N°6</a><br>
 
	<a href="JavaScript:">Lien N°7</a><br>
	<a href="JavaScript:">Lien N°8</a><br>
	<a href="JavaScript:">Lien N°10</a><br>
	<a href="JavaScript:">Lien N°11</a><br>
	<a href="JavaScript:">Lien N°12</a><br>
	<a href="JavaScript:">Lien N°13</a><br>
	<a href="JavaScript:">Lien N°14</a><br>
	</div>
	</font>
	</div>
	</td>
</tr>
 
<tr>
	<td onMouseOver="this.style.backgroundColor  = 'red';" onMouseOut="this.style.backgroundColor = '';">
	<a onMouseOver="return doScrollerIE('down','faq1',5)" onMouseOut="clearInterval(sRepeat)" href="JavaScript:">
	Descendre</a>
	</td>
</tr>
 
</table>
 
 
</body>
</html>

Merci pour toutes vos réponses,
et votre temps passé ...
Encore merci

**RomainVALERI** · 26/01/2009, 23h55

Si tu retires le doctype, les navigateurs interprêtent ta page en "quirks mode", qui est le mode "non-conforme aux standards" (tous sauf Opera je crois, qui n'a pas d'équivalent de ce mode venant d'IE à la base je crois bien).
Ca a visiblement résolu ton problème à court terme, mais sache simplement quand même que, d'une part c'est moins fiable (notamment pour la maintenabilité), d'autre part ça contribue (à toute petite échelle bien sûr

) à faire du web un gros chantier plein de clotures privées plutot qu'une grande bibliothèque organisée du savoir humain, libre et participative. ^^

Mais bon, même sans grands débats lyriques et passionnés sur l'avenir du web, d'une manière très concrète, la conformité aux standards a comme immense avantage de permettre, en cas de problème, de se retourner vers les spécifications, qui sont, pour une grande majorité des cas, suffisamment détaillées et éprouvées pour couvrir l'ensemble des problèmes rencontrés. Dès lors qu'on est "sorti" de cet environnement et qu'on fait confiance à une implémentation opaque du rendu des pages (ce fameux "quirks mode"), on prend le risque de rencontrer des problèmes liés à des spécificités de cette implémentation, bien plus difficiles à déceler et à résoudre car non (ou moins bien) documentés.

Si ces sujets t'intéressent, essaie "conformité aux standard", "web 2.0", voire même "balisage sémantique" dans wikipedia ou toute autre source de ton choix, c'est très bien documenté...

Sinon, pardon pour cette pédante remarque critique, inutile et même en l'occurrence contre-productive, mais... il fallait bien que quelqu'un le dise "pour la bonne cause"

**le.squal** · 31/01/2009, 22h49

Dsl pour ma réponse aussi tardive ...
Si j'ai bien tout compris, le fait de pas mettre le doctype, mon site ne sera pas "rangé" correctement dans le web.
Mais je ne vois quand même pas pourquoi, le fait de ne pas mettre le doctype fait fonctionner mon code ?!? Que vient il changer dans l'histoire ?
Comment garder le doctype qui fait mauvais goût si on l'enlève

et faire fonctionner mon code en même temps ...