如何防止 Foundation 6 中的手风琴动画

Question

我正在尝试使用 Foundation 6 创建一个使用手风琴进行组织的表单。我想向手风琴标题添加输入和按钮。通常，当单击手风琴标题时，它会通过滑动来切换其内容。我想禁用此效果，这样如果我单击标题中的按钮，内容将不会切换，因为如果每次单击按钮时它都会扩展和收缩，这真的很烦人。

我有类似的东西：

    $body.on('click', '.button_on_title', function (event) {
      // do stuff
    });

我试过event.preventDefault()和event.stopPropagation()，都没有效果。似乎 Foundation 6 以某种方式覆盖了事件堆栈？

编辑： 澄清一下，我想防止手风琴在点击时打开和关闭，而不仅仅是删除滑动动画。

Answer 1

您只需将滑动速度设置为0 即可禁用动画。设置滑动速度的一种简单方法是通过 data-slide-speed 数据属性。

以下是文档中添加此属性的示例：

<ul class="accordion" data-accordion data-slide-speed="0">
  <li class="accordion-item is-active">
    <a class="accordion-title">Accordion 1</a>
    <div class="accordion-content" data-tab-content>
      I would start in the open state, due to using the `is-active` state class.
    </div>
  </li>
  <!-- ... -->
</ul>