Question

我正在使用animate.css为我的meteor应用添加一些转换。但是，有一个问题是animate.css会在我的按钮/图像等上创建一个几乎透明的叠加层。

我有一个主div，其中添加了animate.css类，具体取决于更改页面视图等。非常简化这是我的HTML。

<body>
  <header class="header></header>
  <div class="animate-holder {{animated class}}>
     <div class="class1></div>
     <div class="class2></div>
  </div>
</body>

从我测试的结果来看，这种情况一直都会发生，而且我如何使用过渡并不重要。是否有一种简单的方法可以不使用此叠加层？

编辑：

我可以像这样破解它，但这非常非常难看。但也许它可以更深入地了解问题：

Template.DetailsSubmit.rendered = function() {
  Meteor.setTimeout(function() {
    var classes = $('div.animated').attr('class');
    $('div.animated').removeClass(classes);
  }, 1000)
}

Answer 1

你可以通过使用非常有用的（并且不够出名）pointer-events css属性来使这个特定的div可点击：

div.animated {
  pointer-events: none;
}

Animate css在div上创建一个透明字段

1 个答案: