Geek asks and answers

Question about .html () jQuery function?

Right now, when I replace the content inside the div “foo”, the new content appears right away. There is a way for new content to fade out.

<div class="foo">Initial content to be replaced</div>

$('div.foo').html('New content');

I know about the fadeIn () function, the reason I am asking this question is because I can’t figure out how it could be technically possible, since the foo div was never hiding for a start, since it could “disappear” " But still, if someone can think about how super it will be.

+3
source share
4 answers

Use this: $('div.foo').html('New Content').hide().fadeIn();

+4
source

Some of the other answers here do not take into account the fact that the transition takes time - the html will be replaced in the middle of fadeOut and will look like an error.

, fadeOut, html, fadeIn, :

$('div.foo').fadeOut(function () {
   $(this).html('New content').fadeIn();
});
+2

Live Demo

$('div.foo').html('New content').hide().fadeIn();

,

+1

:

$("div.foo").hide("slow").html("New Content").show("slow");

This will cause the div to disappear, the content to change, and then fade out, which can lead to the effect you're looking for.

0
source

More articles:


All Articles