0
votes

Cliquez sur la carte pour afficher le clone de la carte en haut de la page.

coincé. Je ne sais pas comment procéder.

J'ai 10 cartes. Lorsque l'utilisateur clique sur une carte spécifique, je voudrais cloner la carte et l'avoir annoncé à un div code> en haut de la page. Cependant, lorsqu'un utilisateur clique sur une autre carte, je ne veux pas que la première carte disparaisse, je souhaite qu'il reste et ajoutez la deuxième carte à côté de la première carte. Vous souhaitez également afficher un max de 5 cartes au sommet. Si l'utilisateur clique sur une sixième carte, le premier devrait disparaître et la carte cliquée doit apparaître comme la dernière carte, etc. p>

p>



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="main">
  <div class="main1"></div>
  <div class="main2"></div>
  <div class="main3"></div>
  <div class="main4"></div>
  <div class="main5"></div>
</div>

<div class="container">
  <div class="card card-1">
    <p>Card 1</p>
    <p>Lorem ipsum</p>
  </div>

  <div class="card card-2">
    <p>Card 2</p>
    <p>Lorem ipsum</p>
  </div>

  <div class="card card-3">
    <p>Card 3</p>
    <p>Lorem ipsum</p>
  </div>

  <div class="card card-4">
    <p>Card 4</p>
    <p>Lorem ipsum</p>
  </div>

  <div class="card card-5">
    <p>Card 5</p>
    <p>Lorem ipsum</p>
  </div>

  <!-- 5 more cards -->
</div>

javascript jquery

1 commentaires

$ ('. Card1'). Fadein (500) .cLone (). Appendez ($). , mais carte-1 . la même chose pour les cartes 2 à 5.



                                    
                    3 Réponses :
                    
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     Vous pouvez essayer avec détacher () méthode  https://apl.jquery.com/detach/ 

 Comme @CID dit, utilisez le nom de la classe approprié dans le sélecteur JQuery .Card-1 .Card-2 et ainsi de suite sur                                 


                                                                    
                                    
                                    
                                        0 commentaires
                                        
                                                                                    
                                    
                                                            

                        

                        
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     Vous devez utiliser le  clone ()  code> et un chèque pour voir si  .Main  code> a plus de 5 éléments à l'aide de  enfants ()  code>. Veuillez trouver le snippet ci-dessous 
  p> 


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="main">

</div>

<div class="container">
  <div class="card card-1">
    <p>Card 1</p>
    <p>Lorem ipsum</p>
  </div>

  <div class="card card-2">
    <p>Card 2</p>
    <p>Lorem ipsum</p>
  </div>

  <div class="card card-3">
    <p>Card 3</p>
    <p>Lorem ipsum</p>
  </div>

  <div class="card card-4">
    <p>Card 4</p>
    <p>Lorem ipsum</p>
  </div>

  <div class="card card-5">
    <p>Card 5</p>
    <p>Lorem ipsum</p>
  </div>

  <!-- 5 more cards -->
</div>

                                

                                                                    
                                    
                                    
                                        0 commentaires
                                        
                                                                                    
                                    
                                                            
                        
                        
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     Vous pouvez utiliser des enfants (). Premier (). Supprimer pour supprimer le premier. puis appendez un nouveau div. 
 C'est un essai de ce que je pense que vous voulez faire   xxx   xxx                                  

                                                                    
                                    
                                    
                                        0 commentaires