div будет скользить вниз, но он не будет скользить вверх

Question

Я пытаюсь показать и скрыть серию divs, используя toggle, slideUp и slideDown.Я могу перевести div в режим slideDown, но я не могу перевести его в режим slideUp.Раньше я использовал этот скрипт без инцидентов, так что я действительно в замешательстве относительно того, почему это не работает.Я включил свой скрипт и div, который я пытаюсь показать и скрыть.

Краткое примечание:Когда я поместил обычный старый тег p в раздел "скрытые транспортные средства", это сработало нормально.Это проявлялось и пряталось, как и должно было быть.Однако, когда я поместил свою таблицу обратно в этот div, это не сработало.

<script type="text/javascript">
$(document).ready(function() {
    $(".ShowVehicles").toggle(function() {
        $(".HiddenVehicles").slideDown(2000);
        $(this).text("Hide All");
    }, function () {
        $(".HiddenVehicles").slideUp(2000);
        $(this).text("Show All");                
    });
});

<div class="HiddenVehicles" style="display:none; width:730px;">
    (there will be a giant table in here)
    </div>

Answer 1

Я опубликовал этот совет в качестве комментария, и это помогло устранить проблему, поэтому я снова публикую его здесь:

Когда анимация скольжения вверх / вниз работает только в одну сторону, это часто ошибка позиционирования.Либо для элемента, который вы анимируете, необходимо установить значение position:relative или дочерние элементы элемента имеют float применяется к ним и не присваивает родительскому элементу истинную высоту.

Я бы попробовал добавить float:none к столу.Если это не сработает, попробуйте добавить position:relative к тому div#HiddenVehicles.

Answer 2

Для тех, у кого нет проблем с плавающей точкой / позиционированием, я обнаружил, что обновление с jQuery 1.10 до 1.11 решило проблему.