Change text (html) with .animate
$("#test").hide(100, function() {
$(this).html("......").show(100);
});
Updated:
Another easy way:
$("#test").fadeOut(400, function() {
$(this).html("......").fadeIn(400);
});
The animate(..)
function' signature is:
.animate( properties, options );
And it says the following about the parameter properties
:
properties A map of CSS properties that the animation will move toward.
text
is not a CSS property, this is why the function isn't working as you expected.
Do you want to fade the text out? Do you want to move it? I might be able to provide an alternative.
Have a look at the following fiddle.
See Davion's anwser in this post: https://stackoverflow.com/a/26429849/1804068
HTML:
<div class="parent">
<span id="mySpan">Something in English</span>
</div>
JQUERY
$('#mySpan').animate({'opacity': 0}, 400, function(){
$(this).html('Something in Spanish').animate({'opacity': 1}, 400);
});
Live example