Question

我希望你们都能在这里帮助我。我试图隐藏一些td元素，并在点击按钮时显示它们。我去了这个工作。但是没有流畅的动画。

我想要的是让td元素fadeIn和Click me按钮在一个平滑的动画中向下滑动。如果我再次点击Click me按钮td元素fadeOut，按钮会向上滑动。

我有这个工作，但没有动画，它看起来波涛汹涌。有没有办法让这项工作顺利，更好看？

HTML

<table>
  <tr>
    <td>
       text
    </td>
  </tr>
  <tr>
    <td class="clicked" style="display:none;">
      text
    </td>
  </tr>
  <tr>
    <td class="clicked" style="display:none;">
      text
    </td>
  </tr>
  <tr>
    <td class="clicked" style="display:none;">
      text
    </td>
  </tr>
</table>
<button class="text-center click">Click me</button>

JS

$('.click').on('click touchstart', function() {
    $('.clicked').slideToggle(); 
});

JSfiddle：https://jsfiddle.net/73tkr4ht/9/

我已经使用了slideToggle，因为这似乎有效...任何beter解决方案/请帮助。感谢您阅读我的问题！

用动画显示隐藏内容onClick

0 个答案: