Wie mache ich Elemente fadeOut nacheinander auf klicken in Jquery und am Ende eine Nachricht anzeigen

Ich versuche, ein Spiel zu machen, das endet, wenn Sie auf die Felder mit den gleichen Farben klicken, so dass sie auf Klick und auf der ausblenden Ende Anzeige einer Nachricht. Ich bin dazu nicht in der Lage, ich bin relativ neu zu jquery und Javascript. Es wäre eine große Hilfe, wenn jemand eine Lösung finden könnte. Hier ist mein Skript:Wie mache ich Elemente fadeOut nacheinander auf klicken in Jquery und am Ende eine Nachricht anzeigen

<script> 
    $(document).ready(function() { 
     $(".boxr").click(function() { 
     var me = $(this); 
     $(".boxr").not(this).fadeTo('slow', 1, function() { 
     $(me).next().add(me).fadeOut('slow'); 
     }).unbind('click'); 
    $.when($('.boxr').fadeOut(500)).done(function() { 
     alert("You WIN!"); 
    }); 
     $(".boxy").click(function() { 
      $(this).fadeOut(); 
     }); 
     $(".boxb").click(function() { 
      $(this).fadeOut(); 
     }); 

    }); 
</script>

Hier ist der HTML-Körper:

<body> 
<center> 
    <div> 
     <h1 style="font-size:72px;">Welcome!</h1> 
     <h1 id="op"></h1> 
<table><tr> 
<td><div class="boxr" ></div></td> 
<td><div class="boxy" ></div></td> 
<td><div class="boxb" ></div></td> 
<td><div class="boxy" ></div></td> 
</tr> 
</table> 
    </div> 
</center> 
</body>

BOXR ist eine Box mit roter Farbe boxy gelb ist und so weiter.

Quelle

2017-01-17 Santosh Hegde

Meinst du, wenn Sie auf zwei Felder mit der gleichen Farbe klicken, werden sie verblassen? – TheYaXxE

Nein, es kann viele Felder geben, aber sie müssen nur dann verschwinden, wenn sie angeklickt werden –

Ist das nicht so einfach?

$(document).ready(function() { 
    "use strict"; 

    // Bind 
    $('#a').click(function() { 
     $('#a').fadeOut(500, function() { 

      // Remove 
      $('#a').remove(); 

      // Bind again 
      $('#b').click(function() { 
       $('#b').fadeOut(500, function() { 

        // Remove 
        $('#b').remove(); 

        // Bind again! 
        $('#c').click(function() { 
         $('#c').fadeOut(500, function() { 

          // Remove again! 
          $('#c').remove(); 

         }); 
        }); 

       }); 
      }); 
     }); 
    }); 
});

Quelle

2017-01-17 15:04:28 Crowes

Nach dem Entfernen der '# c' können Sie alarmieren" Sie gewinnen !! ". –

Nein, der Code hat nicht funktioniert und die Boxen sind nicht nur 4, es gibt mehr Boxen, nur dass der Code nicht passen konnte. Und das Skript, das ich gab, benutzte, um alle Kästchen der gleichen Farbe auf einmal zu entfernen und die Nachricht anzuzeigen. Während ich möchte, dass es nur beim Klicken verblasst. –

@SantoshHegde Versuchen Sie, meinen Finger auf das zu legen, was Sie wirklich fragen, tut mir leid, wenn das falsch war. Du willst nur, dass die anderen anklickbar sind * sobald * die anderen ausgeblendet sind? Wenn dies der Fall ist, können Sie meine Methode verwenden und nur die Handles im Callback des auszublendenden Fades binden. – Crowes

Wie mache ich Elemente fadeOut nacheinander auf klicken in Jquery und am Ende eine Nachricht anzeigen

Antwort

Verwandte Themen