Velocity.js V2 запускает fadeInDown вместо slideInDown

Question

Есть некоторые проблемы с анимацией speed.js V2, она вызывает анимацию затухания вместо скольжения

FIDDLE

[Фрагмент кода]

$(".trigger").click(function() {
  document.querySelectorAll(".dropdown").velocity("slideInDown", { duration: 500 } );
});

$(".trigger").click(function() {
  document.querySelectorAll(".dropdown").velocity("slideInDown", { duration: 500 } );
});

.trigger {
  padding:15px;
  border:2px solid grey;
  color:#000;
  cursor:pointer;
}

.dropdown {
   display:block;
   opacity:0;
   margin-top:20px;
   background-color:red;
   height:300px;
   width:300px;
   border:2px solid red;
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/velocity-animate@2.0/velocity.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/velocity-animate@2.0/velocity.ui.min.js"></script>


<button class="trigger">
Click 
</button>
<div class="dropdown">
DropDown Content
</div>

Любая помощь будет оценена