18041 sujets

Questions générales et questions de débutants

[résolu] Probleme avec le DOCTYPE

Bonjour,
j'ai écumé les forums, google, etc... et je ne trouve pas.
voici mon code qui fait déplacer un curseur sur une échelle.
Il fonctionne parfaitement sans spécification de Doctype et si je déclare un <!DOCTYPE html>, alors que le code passe la validation W3C, le code javascript ne fonctionne plus, le calcul se fait bien mais le curseur ne bouge pas... Smiley biggol 

<!DOCTYPE html>
<html>
<head>
<title>Calcul d'IMC</title>

<style type="text/css">
#popup {
position:absolute;
width:450px;
height:300px;
top:250px;
left:35%;
text-align:center;
font-family:arial;
background-color:rgb(242,242,242);
box-shadow: 5px 5px 12px black;
z-index:2;
'display:none;
}

.pres {
width:400px;
height:180px;
margin-left:auto;
margin-right:auto;
font-family:arial;
}

.zone_curseur {
width:400px;
height:16px;
margin-left:auto;
margin-right:auto;
text-align: left;
}
</style>

<script type="text/javascript">

function calculimc(p,t)
{var p
var t
    if (document.getElementById){
	t=t/100
var IMC=(p/(t*t)).toFixed(2)
var statIMC="toto"
if (IMC < 17) {statIMC="Famine"};
if (IMC>=17 && IMC<19.5) { statIMC="Maigreur"}
if (IMC>=19.5 &&IMC <25) { statIMC="Poids Normal"}
if (IMC>=25 && IMC <30) {statIMC="Surpoids"}
if (IMC>=30 && IMC <35) { statIMC="Obésité Modérée"}
if (IMC>=35 && IMC <40) { statIMC="Obésité Sévère"}
if (IMC>=40) {statIMC="Obésité Morbide"}
var posi=(IMC*10)-100-6
alert(posi)
document.getElementById("curs").style.top=0;
document.getElementById("curs").style.left=posi;
document.getElementById("texte").value="Votre IMC est égal à " + IMC;
document.getElementById("statut").value= statIMC}
}
</script>


</head>
<body>
 
<div id="popup">
 <img style="position:absolute; right:0.3em; margin-top:5px; width:2em; cursor:pointer;" onclick="document.getElementById('popup').style.display='none';" src="bouton_fermer.jpg" alt="fermer">
   
<div class="pres">
<form>
<br>
<h2>Calcul de votre IMC</h2><br>
Votre taille: <input type="text" name="taille" style="width:5em"> cm  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
Votre poids: <input type="text" name="poids" style="width:5em"> Kg 
<br><br>
<input type="button" value="calculer" onClick="calculimc(poids.value, 
taille.value);"><br><br>
<input type="text" value=" " id="texte" style="width:49%; border:none; 
text-align:center; font-weight:bold; background-color:rgb(242,242,242);">
<input type="text" value=" " id="statut" style="width:49%;  
text-align:center; font-weight:bold; background-color:rgb(242,242,242); border:none;">
</form>
</div>
<br><br>
<div class="zone_curseur">
<img src="curseur.jpg" id=curs alt="curseur" style="position:relative; top:0px; left:-6px">
</div>
<img src="echelle_IMC.jpg" alt="échelle">
</div>

</body>
</html>


Si quelqu'un pouvait m'aider ce serait le bonheur (ça fait 2 jours que je cherche)

Merci d'avance

Philippe
Modifié par filtep (01 Apr 2013 - 22:44)
Bonjour,

Dommage que nous ne disposions pas des images, mais avec ce code js, cela fonctionne avec un doctype (j'ai pris celui pour le HTML5):
function calculimc(p,t)
{
	var p
	var t
	if (document.getElementById){
		t=t/100;
		var IMC=(p/(t*t)).toFixed(2);
		var statIMC="toto"
		if (IMC < 17) {statIMC="Famine"};
		if (IMC>=17 && IMC<19.5) { statIMC="Maigreur";}
		if (IMC>=19.5 &&IMC <25) { statIMC="Poids Normal";}
		if (IMC>=25 && IMC <30) {statIMC="Surpoids";}
		if (IMC>=30 && IMC <35) { statIMC="Obésité Modérée";}
		if (IMC>=35 && IMC <40) { statIMC="Obésité Sévère";}
		if (IMC>=40) {statIMC="Obésité Morbide";}
		var posi=(IMC*10)-100-6;
		alert(posi);
		document.getElementById("curs").style.top = "0px";
		document.getElementById("curs").style.left= posi+"px";
		document.getElementById("texte").value="Votre IMC est égal à " + IMC;
		document.getElementById("statut").value= statIMC;
	}
}

P.S.: vous devriez ajouter un charset et placer le mot "curs" entre guillemets dans 
<img src="curseur.jpg" id=curs alt="curseur" style="position:relative; top:0px; left:-6px">

Modifié par lddsoft (01 Apr 2013 - 17:39)
Bonjour Iddsoft,
en effet, ça fonctionne, il n'y avait pas les ";" !!!
et dire que je galère là dessus depuis 2 jours !

Merci en tous cas, pour voir le résultat je met tout ça en ligne et je met le lien en réponse, merci !

Philippe
Ce n'était pas, avant tout, une question de points-virgules, mais plutôt un manque de "px" au niveau des lignes concernant le style! Smiley cligne

P.S.: un petit "[Résolu]" éviterait une perte de temps pour ceux qui cherchent à aider...
Modifié par lddsoft (01 Apr 2013 - 20:41)
Euh ! je dois être une quiche mais comment met-on résolu ??
je le met "à la main"

Bonne soirée
Modifié par filtep (01 Apr 2013 - 21:55)
Pas mal, le résultat, même si je suis en léger surpoids! Smiley biggrin
Pour mettre en "Résolu", il te suffit d'éditer ton premier post et de placer au début de ton sujet le petit mot que tout le monde espère Smiley cligne .
Sujet clos
Aller à