javascript - 悬停动画CSS，悬停回到正常

Question

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

我用 jquery 和 css 制作了简单的动画。当我悬停时，我希望 span 周围的文本具有动画效果。当我悬停时，我希望文本与原始文本保持正常。

第一次hover好像成功了，但是hover out的部分出不来

$(".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>

Answer 1

您将 animate 拼错为 anminate，像这样更改它，它将起作用。

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