CODEWITHSUNDEEP
javascriptjqueryhtml
user6325904
user6325904

Reputation:

JS/JQuery: Text changes for a few seconds and then back to original

I have a < div > where I keep my score but I want when its right that my text changes to +1 so I can see I was right and then immediately changes back to my score. With my code he shows immediately the POINTS, that fades out and fades in again so the +1 never shows up. Can someone help pls?

if (x >= y){ 
score++;
$("#counter").html("+1");
$("#counter").fadeOut(3000);
$("#counter").fadeIn(3000);
$("#counter").html("POINTS" + score);
}

Upvotes: 1

Views: 69

Answers (2)

scriptkiddie
scriptkiddie

Reputation: 605

try setTimeout

setTimeout(function(){ $("#counter").html("POINTS" + score);},2000);

Upvotes: 0

Rayon
Rayon

Reputation: 36609

.fadeOut in complete-callback of the fadeIn which is being invoked once the .fadeIn is complete.

if (x >= y) {
  score++;
  $("#counter").html("+1");
  $("#counter").fadeOut(3000, function() {
    $("#counter").fadeIn(3000);
    $("#counter").html("POINTS" + score);
  });
}

Upvotes: 1

Related Questions