Hébergeur de fichiers indépendant

difficile (1).html

À propos

Type de fichier
Fichier HTML de 5 Ko (text/html)
Confidentialité
Fichier public, envoyé le 27 avril 2017 à 11:27, depuis l'adresse IP 195.221.x.x (France)
Sécurité
Ne contient aucun Virus ou Malware connus - Dernière vérification: 2 jours
Statistiques
La présente page de téléchargement a été vue 196 fois depuis l'envoi du fichier
Page de téléchargement

Aperçu du fichier


<!DOCTYPE html>
<html>
	<head>
		<title>Difficile</title>
		<meta charset="utf-8">
		<style type="text/css" media="screen">
    		canvas, img { display:block; margin:1em auto; border:1px solid black; }
    		canvas { background:url("https://previews.123rf.com/images/miguelio/miguelio1011/miguelio101100001/8202885-Pr-s-du-sol-Texture-de-la-paille--Banque-d'images.jpg") }
            @font-face {
                font-family: "24h";
                src: url("digital-7.ttf");
            }
			h1{
				font-family: "24h";
				font-size: 100px;
   				position: absolute;
   				top: 100px;
   				left: 65px;
			}
			div{
				font-family: "Times New Roman", Times, Serif;
				font-size: 25px;
   				position: absolute;
   				top: 400px;
   				left: 10px;
			}
            
  		</style>
	</head>

	<body onload="idtimer">

		<h1 id="temps">00:10</h1>
		<canvas id="foin" width="800" height="700"></canvas>
		<div id="compteur">Nombre de points : 0</div>
		
        
		

		
			<script type="text/javascript" charset="utf-8">

				//Initialisation

				var canvas = document.getElementById("foin");
				var context = canvas.getContext("2d");
                var imgAig = document.createElement("img");
                imgAig.setAttribute('src', 'aiguille.png');
                var compt = 0;
                var tailleCarre = 10;
                
				//Déclaration variables coordonées carré indice
                
  			    var ax = (canvas.width-10) * Math.random();
                var ay = (canvas.height-10) * Math.random();
                
                //Déclaration variables coordonées milieu du carré indice
                
 				var bx = ax + 5;                               
 				var by = ay + 5;
                
                //Affichage indice aléatoirement placé
                
               // context.fillStyle = "black";                 
 				//context.fillRect (ax, ay, tailleCarre, tailleCarre);
				


 				//COMPTE A REBOUR
          
				var tps = 10 ;
				var m=0;
				var s=0;
				var disp="";
				var idtimer =setInterval('affichetemps()',1000);
 
				function affichetemps(){
 
  				tps-- ;
  				s = parseInt((tps%20)%60) ;
  				disp = (m<10 ? "0"+m : m) + ':' + (s<10 ? "0"+s : s) ;
  				document.getElementById('temps').innerHTML= disp;
 
  				if (s == 0) { // condition permettant de reinitialiser les coordonées du carré indice ainsi que du CAR dès la fin de celui-ci
                    tps=10;
                    context.clearRect(0,0,800,700);
                    ax = (canvas.width-10) * Math.random();
				    ay = (canvas.height-10) * Math.random();
                    bx = ax + 5;                                   
                    by = ay + 5;

                    
                   // context.fillStyle = "black";                 //carré indice aléatoirement placé
 				    //context.fillRect (ax, ay, tailleCarre, tailleCarre);
				
   					}

				}
                
               
 				function getCoords(el,event) {                      //fonction coordonnées du clic
  					var ox = -el.offsetLeft,
  					oy = -el.offsetTop;
  					while(el=el.offsetParent){
    					ox += el.scrollLeft - el.offsetLeft;
    					oy += el.scrollTop - el.offsetTop;
  					}
  					return {x:event.clientX + ox , y:event.clientY + oy};
				}
 
 				canvas.onclick = function(e) {                           //fonction clic
  					var coords = getCoords(this,e);
  					var distance = Math.sqrt(Math.pow(coords.x - bx, 2) + Math.pow(coords.y - by, 2));
                    

  					//Système chaud froid  

   				    if (distance >= 17) { 
  				    	compt = compt + 10;
  				    	document.getElementById("compteur").innerHTML="Nombre de points : "+compt+" !";
  				    }
  					if (distance <= 17) {  
                        context.clearRect(0,0,800,700);
 				        context.drawImage(imgAig,ax-40,ay-50);
                        setInterval('win()',3000);
  				    }
  				    if (distance > 17 && distance < 80){
  						context.fillStyle = "#FF0000";                      //carré bouillant rouge
 				        context.fillRect (coords.x-(tailleCarre/2), coords.y-(tailleCarre/2), tailleCarre, tailleCarre);
  					}
  					if (distance >= 80 && distance < 200){
  						context.fillStyle = "#FF5E00";                      //carré chaud orange
 				        context.fillRect (coords.x-(tailleCarre/2), coords.y-(tailleCarre/2), tailleCarre, tailleCarre);
  					}
  					if (distance >= 200 && distance < 400){
  						context.fillStyle = "#FFDE00";                      //carré tiède jaune
 				        context.fillRect (coords.x-(tailleCarre/2), coords.y-(tailleCarre/2), tailleCarre, tailleCarre);
  					}
  					if (distance >= 400 && distance < 600){
  						context.fillStyle = "#53A907";                      //carré froid vert
 				        context.fillRect (coords.x-(tailleCarre/2), coords.y-(tailleCarre/2), tailleCarre, tailleCarre);
 				    }
  					if (distance >= 600){
  						context.fillStyle = "#04CAFC";                      //carré glacé bleu
 				        context.fillRect (coords.x-(tailleCarre/2), coords.y-(tailleCarre/2), tailleCarre, tailleCarre);
  					}
  				}
                
                function win(){
                    document.location.href="win.html"
                }
                
             
 
			</script>

	</body>

</html>


Partager le fichier


Télécharger difficile (1).html


Télécharger difficile (1).html