Vertical sliding text animation using Javascript

  html, javascript, jquery-animate

I would like to obtain an animation using Javascript similar to the one in the website, where words are automatically replaced by vertically sliding, within a given interval between each swap. For now I was able to automatically replace words with a fade in / fade out animation, using the code below. How can I edit the function below in order to obtain the vertical slide effect like in the example, preferably using Javascript?


  var words = ["Second", "Third", "Fourth", "Fifth"];
  var index = 0;

  $(function() {
    setInterval(function() {
      $('#header-text-change').fadeOut(500, function() {
        if (index === words.length)
          index = 0
    }, 1400);

  <span id="header-text-change">First</span></h1>

Source: Ask Javascript Questions