Vu mètre
Résolu
calimm
Messages postés
37
Statut
Membre
-
AASPRONI Messages postés 78 Statut Membre -
AASPRONI Messages postés 78 Statut Membre -
Bonjour,
J'essaye de faire un Vu mettre grace à de HTML, du javascript, du CSS et de L'Ajax.
Pour le moment, j'ai crée un DIV et j'ai une fonction javaScript qui permet de modifier la hauteur et la couleur du DIV.
Seulement; rien ne se passe, peut importe le nombre que je met en argument.
Merci d'avance
J'essaye de faire un Vu mettre grace à de HTML, du javascript, du CSS et de L'Ajax.
Pour le moment, j'ai crée un DIV et j'ai une fonction javaScript qui permet de modifier la hauteur et la couleur du DIV.
<!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" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>VU mètre</title>
<style type="text/css">
#mydiv{
position:relative;
display:block;
width:600px;
height:50px;
background-color:white;
border-width:2px;
border-style:solid;
border-color:black;
}
</style>
<script type="text/javascript">
function modify(value){
alert("ok");
if(value >= 0 && value < 80){
mydiv.style.height = value;
mydiv.style.background-color = #33ff11;
} else if(value >= 80 && value < 95){
mydiv.style.height = value;
mydiv.style.background-color = #F0FF1D;
} else if(value >= 95 && value <= 100){
mydiv.style.height = value;
mydiv.style.background-color = #FF3B1D;
} else {
alert("Valeur incorrecte");
}
}
</script>
</head>
<body onload="modify(30);">
<div id="mydiv"></div>
</body>
</html>
Seulement; rien ne se passe, peut importe le nombre que je met en argument.
Merci d'avance
1 réponse
-
Essaie ceci et dit moi si ça marche.
<!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" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>VU mètre</title>
<style type="text/css">
#mydiv{
position:relative;
display:block;
width:600px;
height:50px;
background-color:white;
border-width:2px;
border-style:solid;
border-color:black;
}
</style>
<script type="text/javascript">
function modify(value){
alert("ok");
if(value >= 0 && value < 80){
document.getElementById("mydiv").style.height = value+"px";
document.getElementById("mydiv").style.backgroundColor="#33ff11";
} else if(value >= 80 && value < 95){
document.getElementById("mydiv").style.height = value+"px";
document.getElementById("mydiv").style.backgroundColor="#F0FF1D";
} else if(value >= 95 && value <= 100){
document.getElementById("mydiv").style.height = value+"px";
document.getElementById("mydiv").style.backgroundColor="#FF3B1D";
} else {
alert("Valeur incorrecte");
}
}
</script>
</head>
<body onload="modify(30);">
<div id="mydiv"></div>
</body>
</html>
