Discussion :

[thiseo]

Bonjour,

Je ne suis pas expert en codage et j'aimerais savoir s'il était possible de coder mon besoin (personnel) suivant. Et si c'est possible, si vous pouvez m'aider.

Ma question :
Créer un bouton qui génèrerait aléatoirement un chiffre : soit 1 soit 0. Si c'est 0, l'image associé à 0 s'affiche. Si c'est 1, l'image associé à 1 s'affiche. En tout, un bouton doit généré 3 images de suite. Au bout de ces trois images, nous aurions le total de ces 3 images (soit 0,1,2,3)

Ce qui revient à dire que dans l'ordre, de gauche à droite, nous aurions :
LE BOUTON - La première image - La seconde image - La troisième image - LE RESULTAT en chiffre (des trois images)

[sekaijin]

OUI

Maintenant que tu sais que c'est possible il te reste à le faire
A+JYT

[thiseo]

Merci pour ta réponse.
Pourrais-tu m'aider à le faire ?

Je te remercie par avance.

[SpaceFrog]

regarde du coté de

Code :

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

Math.random()

[Kaamo]

Ou un ptit hack :

Code javascript :

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

new Date%2

[Bovino]

Pas mal en effet.
Du coup, je pense que tu vas être le prochain à qui thiseo demandera de faire son code !

[thiseo]

J'avoue que rien de tout ça me parle.
Alors, à moins qu'une âme charitable se propose de me le coder, effectivement, sinon, je vais me pencher sur ce que vous m'avez donné.

Merci en tout cas pour vos réponses

[Watilin]

Juste pour expliquer les propositions qui ont été faites :

• Math.random est une fonction qui renvoie un nombre aléatoire (à virgule) entre 0 et 1. Pour obtenir un nombre entier, il est nécessaire de multiplier (si nécessaire) puis d'arrondir le résultat. Les méthodes pour arrondir sont :
  
  
  • Math.floor qui arrondit à l'unité inférieure (ex : 3.7 => 3)
  • Math.ceil qui arrondi à la supérieure (4.3 => 5)
  • Math.round qui arrondit au plus proche (7.1 => 7 ; 7.6 => 8)
  
  
• new Date%2 (astucieux Kaamo, je suis épaté encore une fois) tire parti du fait que les objet Date se convertissent tous seuls en entiers quand on les utilise dans une opération de nombres. Ils se convertissent en timestamps qui représentent le nombre de millisecondes écoulés depuis le 1er janvier 1970.
  
  Le % est l'opérateur modulo. a % b renvoie le reste de la division de a par b. Avec 2, les résultats possibles sont 0 ou 1.
  
  Comme les millisecondes défilent très vite pour l'esprit humain, on peut considérer que les timestamps sont des nombres aléatoires. Cela dit, les instructions JavaScript sont plutôt de l'ordre des microsecondes, ce qui fait qu'on risque d'obtenir plusieurs fois le même nombre si on utilise cette technique plusieurs fois dans la même fonction. Dans ton cas thiseo, il vaut mieux utiliser Math.random.

[Golgotha]

Yop.

j'avais un peux de temps, j'ai codé un exemple, ça pourra t'aider je pense.

http://jsfiddle.net/yjhfn/

Le code :

Code html :

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

1
2
3
4
5
6
<img class="pomme" id="Verte" src="http://www.leclaireurdechateaubriant.fr/files/2013/09/Pomme-630x0.jpg" alt="pomme">
<img class="pomme" id="Jaune" 
    src="http://media.meltyfood.fr/article-1083946-ajust_930/les-golden-pomme-la-plus-repandue-sur-vos.jpg" alt="pomme" >    
<button id="add_elem">Add elem.</button>
<button id="clear_elem">Clear</button>
<div class="panier" id="elem"></div>

Code js :

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
$(function(){    
    var tab = [];
    var nb_elem = 0;
    var tab_elem = [];
    tab.push($("#Verte"), $("#Jaune"));
 
    tab[0].hide();
    tab[1].hide();
 
    $("#add_elem").click(function(){
        if (nb_elem < 3){
            var Brand = Math.round(Math.random());
            tab_elem.push(Brand);
            $("#elem").append(tab[Brand].clone().show()); 
            nb_elem++;
            if (nb_elem === 3){ $("#elem").append(tab_elem.toString()); }
        }
    });
 
    $("#clear_elem").click(function(){
        $("#elem").empty(); 
        tab_elem = [];
        nb_elem = 0;
    });
 
});

Code css :

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

1
2
3
4
5
6
7
8
.panier{    margin-top : 20px;
    min-height : 150px;
}
 
 
.pomme{
    height : 100px;
}