javascript - jQuery gritter 插件关闭图标保持隐藏状态

Question

我正在使用 gritter.js 来通知成功或错误消息。它有效，但“X”关闭图标仍然隐藏。我检查了元素的 CSS 规则，它们都没有问题，但没有效果。

<script src="/components/jquery.gritter/js/jquery.gritter.js"></script>
<link rel="stylesheet" href="/components/jquery.gritter/css/jquery.gritter.css" />

  /*some other code*/
  switch (window.location.hash) {
    case "#success":
    $.gritter.add({
      title: 'Molto bene!',
      text: "L'operazione è stata eseguita con successo!",
      sticky: true,
      class_name: 'gritter-success gritter-light'
    });
    break;
    case "#error":
    $.gritter.add({
      title: 'Oops!',
      text: "Qualcosa è andato storto. L'operazione non è stata eseguita!",
      class_name: 'gritter-error gritter-light'
    });
    break;
  }

js 生成如下图标: <a style="display: none;" class="gritter-close" href="#" tabindex="1">Close Notification</a>

CSS 规则是:

.gritter-light .gritter-close {
    background-image: none;
    color: #444;}

//applied onhover
elemento {
    display: block;}

Answer 1

可能有点晚了，但是否可以让您也使用 ace 模板。

我最近遇到了同样的问题。原来 ace 模板有一个 css 规则，将 gritter 关闭图标的字体大小设置为零。简单地覆盖 css 规则就解决了我的问题。