Sujet Précédent Sujet Suivant

Bouger plusieurs div au même endroit

Résolu
backman Messages postés 4 Date d'inscription mercredi 12 décembre 2012 Statut Membre Dernière intervention 13 avril 2014 - 11 avril 2014 à 21:58
backman Messages postés 4 Date d'inscription mercredi 12 décembre 2012 Statut Membre Dernière intervention 13 avril 2014 - 12 avril 2014 à 12:50
Bonjour,
récemment j'ai rencontré un problème que j'ai beaucoup de mal à résoudre.
J'essai de programmer un jeux de solitaire à l'aide de javascrip et html/css mais
je n'arrive pas à bouger toutes les div qui correspondent à mes cartes au même endroit et en même temps. J'ai créer un bouton pour démarrer la petite animation des cartes mais ça ne fonctionne pas comme je voudrais.
Je vais ci-dessous vous montrez une parti de mon code. 

<div class="menu">
<!-- il y 'a un menu qui contient mon Bouton Start -->
        <button> Commencer le jeux</button>
    </div>
    <div class="table">
        <div class="droppable" id="pioche"></div>
        <div class="droppable" id="main"></div>
        <div class="droppable" id="high_frame1"></div>
        <div class="droppable" id="high_frame2"></div>
        <div class="droppable" id="high_frame3"></div>
        <div class="droppable"id="high_frame4"></div>

        <div id="asdecoeur" class="carte" ></div>
        <div id="asdetreffle" class="carte"></div>
        <div id="asdecarr" class="carte" ></div>
        <div id="asdepique" class="carte" ></div>
        <div id="roidepique" class="carte" ></div>


du coté Javascript j'ai fait 
$("button").click(function(){$("#asdepique").animate({left:'50px',top :'5px' }).appendTo("#pioche");}); 
$("button").click(function(){$("#asdecarr").animate({left:'50px',top :'5px' }).appendTo("#pioche");}); 
$("button").click(function(){$("#asdetreffle").animate({left:'50px',top :'5px'}).appendTo("#pioche");}); 
$("button").click(function(){$("#asdecoeur").animate({left:'50px',top :'5px'}).appendTo("#pioche");}); 
$("button").click(function(){$("#roidepique").animate({left:'50px',top :'5px' }).appendTo("#pioche");});


Ce que j'aimerais c'est que lorsque j'appuis sur le bouton toutes mes cartes soient envoyées dans la div "#pioche".

Merci d'avance pour votre aide

1 réponse

Réponse 1 / 1
jordane45 Messages postés 37718 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 22 septembre 2023 342
Modifié par jordane45 le 12/04/2014 à 02:40
bonsoir,

sans avoir testé : 
$("button").click(function(){
 $("#asdepique").animate({left:'50px',top :'5px' }).appendTo("#pioche");
 $("#asdecarr").animate({left:'50px',top :'5px' }).appendTo("#pioche");
 $("#asdecarr").animate({left:'50px',top :'5px' }).appendTo("#pioche");
 $("#asdetreffle").animate({left:'50px',top :'5px'}).appendTo("#pioche");
 $("#asdecoeur").animate({left:'50px',top :'5px'}).appendTo("#pioche");
 $("#roidepique").animate({left:'50px',top :'5px' }).appendTo("#pioche");
});


ou peut être via la class carte : 

$("button").click(function(){
 $(".carte").animate({left:'50px',top :'5px' }).appendTo("#pioche");
});


Edit : Testé...les deux marchent

Avant de poser une question, merci de lire la charte du site.
Cordialement, Jordane
0
backman Messages postés 4 Date d'inscription mercredi 12 décembre 2012 Statut Membre Dernière intervention 13 avril 2014
12 avril 2014 à 12:50
Oui, effectivement les deux méthodes fonctionnent . Merci :D
0

Discussions similaires

la division en java
cs_aliomar -
KIRAIII -

3 réponses
Agrandissement et reduction d'une div onclick
davidcian -
davidcian -

4 réponses
[Division] récupérer la partie entière d'une division avec un arrondi supérieur
Frouf85 -
Frouf85 -

8 réponses
division du type 1/x renvoie 0
cmonnom -
cmonnom -

6 réponses
Vider un div de son contenu avant de faire un innerHTML dessus
nicomilville -
nicomilville -

9 réponses
Rejoignez-nous