PHPfrance

la communauté d'entraide francophone dédiée au PHP

[RESOLU] Jeu de carte

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : [RESOLU] Jeu de carte

Re: Jeu de carte

par AB » 23 avr. 2013, 19:27

Je ferais un truc dans le genre :
[javascript]<script type="text/javascript">
function changerImage(id)
{
document.getElementById(id).src="Images/"+id+"_on.png";
}
</script>

<a onclick="changerImage('card1')" /><img id="card1" src="Images/card1_back.png" ></a>[/javascript]

Mais bon tu auras certainement beaucoup de javascript à faire et l'emploi d'une lib comme jquery te faciliteras grandement la tâche

Re: Jeu de carte

par marouane91 » 23 avr. 2013, 13:57

Salut Nightshed,

Essaie en CSS avec l'hover ou click dépendant de l'évènement déclencheur que tu préfères le plus, cependant faudra une image qui égale exactement la dimension de la carte qui sera vide (transparente) .png, à travers cette dernière passera les deux images (l'initiale et la nouvelle).

Jeu de carte

par Nightshed » 09 avr. 2013, 10:43

Bonjour à tous,

Bon voilà, excusez-moi tout d'abord si je ne suis pas dans la bonne section, ou bien si un sujet existe déjà, mais je n'ai rien trouvé avec Rechercher.
Voilà je bosse en ce moment sur un jeu de tarot, il faut que je retourne la carte quand on clique dessus.
Bon pour la première étape je ne m’intéresse qu'à changer l'image en gros (sans donner l'effet de retournement).

Voilà le code que j'ai pour le moment : 
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-15" />
		<title>Spirit Guidance</title>
	</head>
	<link rel="stylesheet" href="style.css" type="text/css" />
	
	<script>
		function changerImage(){
			document.card1.src = 'C:\Users\...\Card_1.png';
		}
	</script>
	
	<div id="menu">
		<a id="carte1" onclick="changerImage()" /><img class="card1" name="card1" src="C:\Users\...\Card_0_Back.png" ></a>
		<a id="carte2" onclick="changerImage()" /><img class="card2" name="card2" src="C:\Users\...\Card_0_Back.png" ></a>
		<a id="carte3" onclick="changerImage()" /><img class="card3" name="card3" src="C:\Users\...\Card_0_Back.png" ></a>
		<a id="carte4" onclick="changerImage()" /><img class="card4" name="card4" src="C:\Users\...\Card_0_Back.png" ></a>
		<a id="carte5" onclick="changerImage()" /><img class="card5" name="card5" src="C:\Users\...\Card_0_Back.png" ></a>
	</div>
		
	<div id="droite">
		<iframe id="iframe" width="700" height="450" frameborder="0"></iframe>
	</div>
</html>