JQuery .slideToggle не гладко на столе

Nickolas Cage спросил: 26 ноября 2017 в 04:48 в: javascript

У меня есть внутренняя таблица внутри внешней таблицы, которая содержит данные из внешней. Я решил скрыть это и показывать это только пользователю, нажимающему кнопку "Развернуть". Я сделал это с помощью функции JQuery slideToggle, как эта

$(document).ready(function() {
  $('.partTableContent').hide();
  $('.expandButton').click(function() {
    // .parent() selects the A tag, .next() selects the P tag
    $(this).closest('tr').next(' tr').find('table').slideToggle(200);
  });
});

Html:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="partsTable">  <tr>    <td class="sideForPartsTable" width="5%">
      <button class="expandButton">Expand button</button>
    </td>
    <td class="sideForPartsTable">Title + sum1 + sum2</td>
    <td class="sideForPartsTable" width="5%">edit</td>
    <td class="sideForPartsTable" width="5%">remove</td>  </tr>  <tr>
    <td>
      <table class="partTableContent">
        <tr>
          <td> Test1 </td>
        </tr>
        <tr>
          <td> Test2 </td>
        </tr>
      </table>
    </td>
  </tr></table>

Но анимация этого действия оставляет много для быть желанным. Скрытое содержимое всплывает мгновенно без какой-либо плавной анимации. Я пытался использовать "медленно" внутри .slideToggle и изменить ширину таблицы. Но это не сработало. Есть идеи?

javascript jquery html

JQuery .slideToggle не гладко на столе

0 ответов