jquery: $(). Animate() nie jest funkcją

Question

Zrobiłem sporo poszukiwań i nie byłem w stanie znaleźć odpowiedzi na moje pytanie, więc tutaj idzie.

Próbuję utworzyć menu slideout przełączania z this tutorial, a ja otrzymuję błąd slideoutMenu.animate is not a function

oto div html w pytaniu:

<div id="corner-button"><a href="#" class="slideout-menu-toggle">myLink</a></div> 

    <div class="slideout-menu"> 
      <h3><a href="#" class="slideout-toggle">Toggle</a></h3> 
      <ul> 
       <li>Add new task</li> 
       <li>See completed tasks</li> 
       <li>Go to metrics page</li> 
      </ul> 
     </div> 

i tu jest mój funkcji js:

$(document).ready(function(){ 
    $('.slideout-menu-toggle').on('click', function(event){ 
     event.preventDefault(); 
     console.log("in the toggle func"); 
      var slideoutMenu = $(".slideout-menu"); 
      var slideoutMenuWidth = $(".slideout-menu").width(); 
      console.log("width : " + slideoutMenuWidth); 
      slideoutMenu.toggleClass("open"); 

      if(slideoutMenu.hasClass("open")){ 
       console.log("open...."); 
       slideoutMenu.animate({ 
        left: "0px" 
       }, 500); 
      } else { 
       slideoutMenu.animate({ 
       left: -slideoutWidth 
       }, 250); 
     } 
    }); 
}); 

próbowałem wiele rzeczy, owijając wyżej w prostej funkcji javaScript i korzystania

(function($){ 
    // code here 
}) 

, ale wszystkie powodują ten sam błąd. Kody, które znalazłem w związku z tym problemem na stackoverflow, skierowały głównie użytkowników do "animowania" zamiast "animowanego" lub upewnienia się, że używają jquery, a nie domu.

Przeszukane przez kilka innych, ale to tylko wariacje na temat tego, co już zrobiłem. testowane w firefox i chrome.

podczas dodawania oświadczenie dziennika konsola console.log($.fn.jquery); uzyskać:

3.1.0 -ajax,-ajax/jsonp,-ajax/load,-ajax/parseXML,-ajax/script,-ajax/var/location,-ajax/var/nonce,-ajax/var/rquery,-ajax/xhr,-manipulation/_evalUrl,-event/ajax,-effects,-effects/Tween,-effects/animatedSelector,-deprecated 

dzięki.

Answer 1

Wygląda na to, że używasz szczupłej wersji jQuery 3.1.0, która nie zawiera większości bibliotek. Zamiast tego powinieneś używać pełnej wersji.

https://code.jquery.com/jquery-3.1.0.js