CODEWITHSUNDEEP
jqueryhtml
Tom MJ
Tom MJ

Reputation: 41

Jquery animate replaceWith so it fades in

I'd like the 'Answer' text to fade in. 

<div id="div1" style="cursor: pointer;">Reveal</div>
<script>
$("#div1").click(function () {
$('#div1').fadeOut(1000,function(){ $(this).replaceWith("<span>ANSWER HERE</span>" ); });
});
</script>

Upvotes: 0

Views: 241

Answers (2)

user2172737
user2172737

Reputation:

I have corrected my answer now please check this out.

$(document).ready(function() {
  $("#div1").click(function() {
    $(this).hide();
    $(this).text("finaly it answered .................");
    $(this).fadeIn(2000);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div1" style="cursor: pointer;">Reveal</div>

Upvotes: 1

Ivin Raj
Ivin Raj

Reputation: 3429

try this one:

Html:

<div id="div1">Reveal</div>

CSS: 

#div1
{
  cursor: pointer;
}

JQuery

$("#div1").click(function () {
$('#div1').fadeOut(1000,function(){ $(this).replaceWith("<span>ANSWER HERE</span>" ); });
});

DEMO HERE

OR

UPDATED FIDDLE FILE HERE DEMO HERE

Upvotes: 0

Related Questions