tirage de carte . [Résolu]

King_T · 22/03/2011, 15h25

Salut

je cherche comment reproduire ce système de tirage de carte ici.

je bloque complètement.
merci pour votre aide.

nadox · 22/03/2011, 16h16

Bonjour,

Je ne crois pas avoir compris ce qui te bloque... à moins que .... tu ne l'as pas précisé ?

nox75 · 22/03/2011, 16h17

Qu'est ce qui te bloque exactement ?
Qu'as-tu essayé ?
Qu'as-tu obtenu ?

Si tu souhaites une réponse en phase avec ton besoin, il faut préciser ta question

Willpower · 23/03/2011, 10h42

Code html :

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
27
28
29
30
31
32
33
34
35
36
37
38
<body>
<img id=image_de_la_carte1 src=http://profile.ak.fbcdn.net/hprofile-ak-snc4/195281_750599009_7762928_q.jpg />
<img id=image_de_la_carte2 src=http://profile.ak.fbcdn.net/hprofile-ak-snc4/195281_750599009_7762928_q.jpg />
<img id=image_de_la_carte3 src=http://profile.ak.fbcdn.net/hprofile-ak-snc4/195281_750599009_7762928_q.jpg />
<img id=image_de_la_carte4 src=http://profile.ak.fbcdn.net/hprofile-ak-snc4/195281_750599009_7762928_q.jpg />
<img id=image_de_la_carte5 src=http://profile.ak.fbcdn.net/hprofile-ak-snc4/195281_750599009_7762928_q.jpg />
<br/>
<input type=button id=pioche value="piocher une carte" />
<script type="text/javascript">
 
function $(id){return document.getElementById(id);};
 
var cartes = [
	'http://profile.ak.fbcdn.net/hprofile-ak-snc4/187641_836390170_4350300_q.jpg',
	'http://profile.ak.fbcdn.net/hprofile-ak-snc4/173501_554630434_2353797_q.jpg',
	'http://profile.ak.fbcdn.net/hprofile-ak-snc4/187544_1614031862_2863165_q.jpg',
	'http://profile.ak.fbcdn.net/hprofile-ak-snc4/195672_585519149_3582184_q.jpg',
	'http://profile.ak.fbcdn.net/hprofile-ak-snc4/186146_100000707581849_7544680_q.jpg',
	'http://profile.ak.fbcdn.net/hprofile-ak-snc4/161588_531361345_7144949_q.jpg',
	'http://profile.ak.fbcdn.net/hprofile-ak-snc4/49947_612427245_2039770_q.jpg',
	'http://profile.ak.fbcdn.net/hprofile-ak-snc4/49941_603487346_1227300_q.jpg'
	];
 
var nombreDeCartesTirees = 0;
 
 
function pioche(){
  if(nombreDeCartesTirees >= 5) {
    alert('toutes les cartes ont deja été tirées'); return;
  }
  $('image_de_la_carte'+ ++nombreDeCartesTirees).src = cartes.splice(Math.floor(Math.random() * cartes.length),1)[0];
}
 
$('pioche').onclick = pioche;
 
</script>
 
</body>

Willpower · 23/03/2011, 12h41

version avec une seule image de cartes à jouer (et donc un seul chargement lors du chargement de la page).

Code :

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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
 
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans nom</title>
<style type="text/css">
.carte{
	width:47px;
	height:67px;
	overflow:hidden;
	float:left;
	margin:5px;
}
img{
	position:relative;
	top:-268px;
	left:-92px;
}
</style>
</head>
 
<body>
<div class="carte"><img id=image_de_la_carte1 src=http://a21.idata.over-blog.com/0/51/39/34/jeu-de-cartes.jpg /></div>
<div class="carte"><img id=image_de_la_carte2 src=http://a21.idata.over-blog.com/0/51/39/34/jeu-de-cartes.jpg /></div>
<div class="carte"><img id=image_de_la_carte3 src=http://a21.idata.over-blog.com/0/51/39/34/jeu-de-cartes.jpg /></div>
<div class="carte"><img id=image_de_la_carte4 src=http://a21.idata.over-blog.com/0/51/39/34/jeu-de-cartes.jpg /></div>
<div class="carte"><img id=image_de_la_carte5 src=http://a21.idata.over-blog.com/0/51/39/34/jeu-de-cartes.jpg /></div>
<br/><br/><br/><br/><br/>
<input type=button id=pioche value="piocher une carte" />
<script type="text/javascript">
 
function $(id){return document.getElementById(id);};
 
var cartes = [
	'as de treffle','deux de treffle','trois de treffle','quatre de treffle','cinq de treffle','six de treffle','sept de treffle','huit de treffle','neuf de treffle','dix de treffle','valet de treffle','dame de treffle','roi de treffle',
	'as de carreau','deux de carreau','trois de carreau','quatre de carreau','cinq de carreau','six de carreau','sept de carreau','huit de carreau','neuf de carreau','dix de carreau','valet de carreau','dame de carreau','roi de carreau',
	'as de coeur','deux de coeur','trois de coeur','quatre de coeur','cinq de coeur','six de coeur','sept de coeur','huit de coeur','neuf de coeur','dix de coeur','valet de coeur','dame de coeur','roi de coeur',
	'as de pique','deux de pique','trois de pique','quatre de pique','cinq de pique','six de pique','sept de pique','huit de pique','neuf de pique','dix de pique','valet de pique','dame de pique','roi de pique',
	];
 
var nombreDeCartesTirees = 0;
 
function getPos(str){
	str = str.replace('as',0).replace('deux',46).replace('trois',92).replace('quatre',138).replace('cinq',184).replace('six',230).replace('sept',276).replace('huit',323).replace('neuf',369).replace('dix',415).replace('valet',461).replace('dame',507).replace('roi',553).replace('treffle',0).replace('carreau',67).replace('coeur',134).replace('pique',201);
	return {x:parseInt(str.split(' ')[0]),y:parseInt(str.split(' ')[2])};
}
 
function pioche(){
  if(nombreDeCartesTirees >= 5) {
    alert('toutes les cartes ont deja été tirées'); return;
  }
  var pos = getPos(cartes.splice(Math.floor(Math.random() * cartes.length),1)[0]);
  $('image_de_la_carte'+ ++nombreDeCartesTirees).style.left = -pos.x + 'px';
  $('image_de_la_carte'+ nombreDeCartesTirees).style.top = -pos.y + 'px';
}
 
$('pioche').onclick = pioche;
 
</script>
 
</body>
</html>

edit:

pour l'instant ma meilleure main fut un brelan d'as

arg: j'ai eu un full de 9 par les 3 .. mais j'ai oublié de screen-shooter ! salaud tu m'as rendu accro à mon propre code !

King_T · 23/03/2011, 18h34

C'est bon , merci

!

22/03/2011, 15h25	#1
King_T Membre régulier Développeur Web Inscription : mai 2006 Messages : 157 Détails du profil Informations personnelles : Sexe : Localisation : Tunisie Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Multimédia et Internet Informations forums : Inscription : mai 2006 Messages : 157 Points : 86 Points : 86	tirage de carte . Salut je cherche comment reproduire ce système de tirage de carte ici. je bloque complètement. merci pour votre aide. __________________ Dreaming in Digital, Living in Realtime, Thinking in Binary, Talking in IP .... Welcome to our World !!!!
	00

23/03/2011, 18h34	#6
King_T Membre régulier Développeur Web Inscription : mai 2006 Messages : 157 Détails du profil Informations personnelles : Sexe : Localisation : Tunisie Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Multimédia et Internet Informations forums : Inscription : mai 2006 Messages : 157 Points : 86 Points : 86	C'est bon , merci ! __________________ Dreaming in Digital, Living in Realtime, Thinking in Binary, Talking in IP .... Welcome to our World !!!!
	00

22/03/2011, 16h16	#2
nadox Membre expérimenté Développeur Inscription : février 2010 Messages : 360 Détails du profil Informations personnelles : Sexe : Localisation : France, Calvados (Basse Normandie) Informations professionnelles : Activité : Développeur Secteur : High Tech - Multimédia et Internet Informations forums : Inscription : février 2010 Messages : 360 Points : 545 Points : 545	Bonjour, Je ne crois pas avoir compris ce qui te bloque... à moins que .... tu ne l'as pas précisé ?
	00

22/03/2011, 16h17	#3
nox75 Membre actif Inscription : octobre 2006 Messages : 353 Détails du profil Informations forums : Inscription : octobre 2006 Messages : 353 Points : 158 Points : 158	Qu'est ce qui te bloque exactement ? Qu'as-tu essayé ? Qu'as-tu obtenu ? Si tu souhaites une réponse en phase avec ton besoin, il faut préciser ta question
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email