Systeme de notation

Commenter

Contenu du snippet

Un systeme de notation en CSS et en Javascript. A vous de l'adapter.

Source / Exemple : 


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  <style>
  
  .notations
  {
   position : relative;
   border : 2px solid #000000;
   width : 155px;
   height : 20px;
  }
  </style>  
  
  <script>
  
  function notationobjet(objetnom,num)
  {
   var commentaire = new Array("Pffff","Bof","Mouais","Moyen","Correct","Normal","Bien","Cool","Super","Génial");
   var coultab = "02468ABCDEF";
   var i;
   var tp,tp2;
   for(i=0;i<10;i++)
   
   {
    tp = coultab.charAt(i);
    tp2 = coultab.charAt(10-i);
    var obj=document.getElementById(objetnom+i);
    var couleur = "#"+tp2+tp2+tp+tp+"00";
    if(i<num+1){obj.style.backgroundColor=couleur;}else{obj.style.backgroundColor="#FFFFFF";}
   }
   document.getElementById(objetnom+"com").innerHTML=commentaire[num];  
  }
  
  function validnotation(num)
  {
   alert(num+1);
  }
  
  function resetnotation(objetnom)
  {
   var i;//alert('cool');
   for(i=0;i<10;i++)
   
   {
    var obj=document.getElementById(objetnom+i);
    //alert(objetnom+i);
    obj.style.backgroundColor="#FFFFFF";
   }
  document.getElementById(objetnom+"com").innerHTML="";  
  }
  
  function notation(objetnom)
  {
  var i;
  var tmp="";
  var objet = document.getElementById(objetnom);
  for(i=0;i<10;i++)
  {
  //alert(objetnom);
      tmp +='<div id="'+objetnom+i+'" style="background-color:#FFFFFF;position:absolute;left:'+(15*i+1)+'px;top:1px;height:14px;width:14px;border:2px solid black;background-color:white;font-size:0px;" onclick="validnotation('+i+')" onmouseover="notationobjet(\''+objetnom+'\','+i+')" onmouseout="resetnotation(\''+objetnom+'\')"></div>';
  }
  objet.innerHTML = tmp+'<div id="'+objetnom+'com" style="position:absolute;font-size:14px;left:160px;top:1px;"></div>';
  }
  </script>
  
  </head>

  <body>
   <div id="note" class="notations"></div><script>notation("note");</script>
  </body>
</html>

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (biskbart)