tabs - 在 Zurb Foundation 中淡入标签？

Question

我想弄清楚 Zurb Foundation 中是否有设置可以很好地淡入标签。

如果没有，有没有人知道手动实现这一目标的最佳方法？

jQuery 的目标是什么？

谢谢。

Answer 1

使用 Zurb v5 和 this post我能够通过在 中添加自定义部件来完成淡入淡出标签。基础.css 如下:

.tabs-content {
  *zoom: 1;
  margin-bottom: 1.5rem; 

  /* Customized */
  display:block:important!
  opacity: 0;
}
  /* Customized */
  @-webkit-keyframes fadeIn {
      from { opacity: 0; }
        to { opacity: 1; }
  }
  @keyframes fadeIn {
      from { opacity: 0; }
        to { opacity: 1; }
  }
  .tabs-content:before, .tabs-content:after {
    content: " ";
    display: table; }
  .tabs-content:after {
    clear: both; }
  .tabs-content > .content {
    display: none;
    float: left;
    padding: 0.9375rem 0; }
    .tabs-content > .content.active {

      /* Customized */
      -webkit-animation: fadeIn 1s;
      animation: fadeIn 1s;
      opacity: 1;

      display: block; }