|
 |
Voici un petit jeu dont le principe est connu de beaucoup de personnes mais ne le
dévoilons pas tout de suite.
Concr&eciorc;tement, le navigateur vous présente 5 cartes à jouer parmi 20 (du Dix à l'As dans les 4
couleurs habituelles). Vous sélectionnez mentalement une de ces 5 cartes puis vous cliquez sur le lien qui la fera
disparaître... et miracle, votre carte a bel et bien disparue !!
Pour avoir l'explication du 'truc', sélectionnez les quelques lignes 'vides' ci-dessous :
Le truc :
On vous présente 5 cartes parmi 20.
On vous en présente ensuite 4, mais aucune n'était là avant : si on vous propose au départ le
10 de pique, on vous montrera ensuite le 10 de trefle, sachant que la plupart du temps, vous n'aurez pas retenu toutes
les cartes mais seulement une apparence générale du tirage (des têtes ou pas, du rouge, du noir),
l'illusion est donc parfaite.
Fin de l'explication du truc. |
 |
 |
 |
|
 |
On sélectionne au hasard 5 nombres entre 0 et 19 (puisqu'on a 20 cartes), on appelle
ensuite ces cartes parmi la liste qu'on a constituée au départ dans un tableau JavaScript et on affiche les
5 cartes sur la page.
Pour la disparition de la carte, on transforme d'abord les 5 cartes en leurs 'quasi jumelles' (on remplace les piques par
des trefles, les coeurs par des carreaux et vice-versa) puis on sélectionne une des 5 cartes au hasard, on la
retire et on présente les 4 cartes restantes qui bien sûr ne peuvent inclure la carte qui avait
été repérée par le joueur !!
Pour brouiller un peu la mémoire visuelle du joueur, on lui présente d'abord le dos des cartes, il
affichera lui-même les réponses en passant sur les cartes. |
 |
 |
 |
|
 |
dans la partie <head>
 |
 |
 |
 |
<script language="JavaScript">
// on choisi la valeur en abcisse (valeurx)
// Liste des noms des cartes
// Premier caractère : une lettre (c) juste pour éviter les problèmes avec Netscape
// Second caractère : niveau de la carte : 1 = 10, 2 = valet...
// Troisième caractère : la couleur : n = noir, r = rouge
// Quatrième caractère : le symbole en fonction de la couleur : 0 = coeur ou pique, 1 = carreau ou trefle
// Ex : c1n0 = 10 de pique, c1n1 = 10 de trefle, c5r1 = as de carreau
var cartes_lst = new Array('c1n0','c1n1','c1r0','c1r1','c2n0','c2n1', 'c2r0','c2r1','c3n0','c3n1','c3r0','c3r1','c4n0','c4n1','c4r0','c4r1', 'c5n0','c5n1','c5r0','c5r1');
// Le tableau qui recevra les index 5 cartes sélectionnées
var choix = new Array();
// Le tableau qui recevra les intitulés des 5 cartes sélectionnées
var cartes_choisies = new Array();
// Génération d'un nombre aléatoire entre 0 et 19 pour sélectionner une carte
function alea() {
// Cette méthode génère un nombre entre 0 et 1 (0,3456 ou 0,7834...)
var resultat = Math.random();
var qte_cartes = 1/(cartes_lst.length);
// On compare le nombre aléatoire à 1 divisé par 20 et on renvoie le numéro de l'intervalle pour obtenir un nombre entre 0 et 19
for ( k = 0; k < cartes_lst.length; k++ ) {
if ( resultat >= (qte_cartes*k) && resultat < (qte_cartes*(k+1)) ) { return k; }
}
}
// On va choisir les cartes
function cartes_select() {
// On en prend 5
for ( i = 0; i < 5; i++ ) {
// On lance la génération du nombre aléatoire qui nous reviendra entre 0 et 19
choix[i] = alea();
// L'intitulé de la carte correspondante est placé dans le tableau 'cartes_choisies'
cartes_choisies[i] = cartes_lst[(choix[i])];
}
// Classement alphabétique des 5 cartes pour éviter que deux cartes de même valeur et de même couleur (noir ou rouge) ne soit présentes
cartes_choisies.sort();
for ( var j = 0; j < 5; j++ ) {
if ( j < 4 ) {
// Si les trois premiers caractères d'une carte sont identiques à ceux de la carte suivante (c1n ou c4r ou c3n...)
if ( (cartes_choisies[j].substring(0,3)) == (cartes_choisies[(j + 1)].substring(0,3)) ) {
// On relance le choix des cartes !
cartes_select();
}
}
}
}
// Affichage des 5 cartes sélectionnées dans un tableau HTML
function affiche() {
// On sélectionne les cartes
cartes_select();
// Pour être sur que les cartes on été sélectionnées
if ( cartes_choisies.length > 0 ) {
// Début de l'écriture du tableau
document.write('<table cellspacing="5" cellpadding="1" border="0"><tr>');
// On écrit une cellule pour chaque carte (5)
for ( l = 0; l < 5; l++ ) {
document.write('<td><img src="cartes/' + cartes_choisies[l] + '.gif"></td>');
}
// On termine le tableau HTML
document.write('</tr></table>');
}
}
// Sélection d'un nombre aléatoire entre 0 et 4 inclus
function alea2() {
var resultat = Math.random();
var qte_cartes = 1/5;
for ( o = 0; o < 5; o++ ) {
if ( resultat >= (qte_cartes*o) && resultat < (qte_cartes*(o+1)) ) { return o; }
}
}
// Affichage des 4 nouvelles cartes
function magie() {
// On créé le tableau qui accueillera les cartes
var cartes_rendues = new Array();
for ( m = 0; m < 5; m++ ) {
// Si l'intitulé de la carte se termine par 0, on met 1 à la place
if ( cartes_choisies[m].substring(3,4) == '0' ) { cartes_rendues[m] = cartes_choisies[m].substring(0,3) + '1'; }
// Si l'intitulé de la carte se termine par 1, on met 0 à la place
if ( cartes_choisies[m].substring(3,4) == '1' ) { cartes_rendues[m] = cartes_choisies[m].substring(0,3) + '0'; }
}
// On élimine une des 5 cartes au hasard
delete cartes_rendues[alea2()];
// On classe les cartes pour que la carte 'vide' soit placée à la fin du tableau
cartes_rendues.sort();
// Début de l'ecriture du tableau HTML des nouvelles cartes
document.write('<center>Passez sur les images pour les retourner...<table cellspacing="5" cellpadding="0" border="0"><tr>');
// Pour chacune des 4 cartes, une cellule, on place les images du dos de la carte pour briser un peu la mémoire visuelle, OnMouseOver, les cartes rendues
for ( n = 0; n < 4; n++ ) {
document.write('<td><a href="javascript:void(0);" OnMouseOver="document.' + cartes_rendues[n] + '.src=\'cartes/' + cartes_rendues[n] + '.gif\';return true;"><img src="cartes/cdos.gif" name="' + cartes_rendues[n] + '" border="0"></a></td>');
}
// On termine le tableau HTML
document.write('</tr></table>Impressionnant non ?<br><a href="javascript:history.back();">rejouer</a><br>');
}
</script>
|
|
 |
 |
 |
 |
dans la partie <body>
 |
 |
 |
 |
Choisissez une carte (souvenez-vous en...)
<!-- Affichage des 5 cartes tirees au hasard -->
<script language="JavaScript">affiche();</script>
<!-- Lancement de la disparition -->
<a href="javascript:magie();">Cliquez ici, je la fais disparaître...</a>
|
|
 |
 |
 |
 |
|
 |
 |
 |
|
 |
|