javascript - 将鼠标悬停以动画CSS，将鼠标悬停以恢复正常

http://jsfiddle.net/n8mjtyz0/11/

我有jquery和CSS的简单动画。
当我将鼠标悬停时，我希望跨范围的文本具有动画效果。
当我悬停时，我希望文本与原始文本一样。

我似乎在第一次悬停时就成功了，但是我无法将悬停部分删除。

$(".mapname").mouseover(function() {
  $(".baseup").animate({
    top: "-0.19em"
  }, function() {
    $(".baseup").anmiate({
      top: "0"
    });
  });
});

.mapname {
  position: fixed;
  font-size: 1.3em;
  top: 10px;
  left: 20px;
}

.baseup {
  position: relative;
  top: 0;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="mapname" id="click">
  G
  <span class="baseshow baseup">eograp</span> hi
  <span class="baseshow baseup">ca</span> l M
  <span class="baseshow baseup">ap</span>
</div>

最佳答案

您已经将animate拼写为anminate，将其更改为这样，它将起作用。

 function() {
    $(".baseup").animate({
    top: "0"
    });
  });
 });