jquery - 页脚动画有效但文本未显示

Question

我有一个简单的动画页脚，当我将鼠标悬停在 div 显示上时，我无法显示文本。这让我头疼...

 //Animated Footer
  $("#foeter")
    .mouseenter(function() {
      $("#invisible").slideDown("1000");
    })
    .mouseleave(function() {
      $("#invisible").slideUp("1000");
    });
  });

https://jsfiddle.net/rekgd5tc/

有人知道我在这里缺少什么吗？

Answer 1

问题在于您正在使用 bootstrap css 并且 bootstrap 中的类 .invisible 添加了 visibility: hidden。

尝试更改类名或删除它并在您的 CSS 中使用不同的选择器，例如 ID。

https://jsfiddle.net/rekgd5tc/1/

#invisible {
    display:none;
    background-color: pink;
}

<div id="invisible"> </div>