TypeError : p.easing[this.easing] n'est pas une fonction

Question

Lorsque j'essaie d'afficher un élément div avec jQuery, j'obtiens cette erreur :

[23:50:35.971] TypeError: p.easing[this.easing] is not a function @ file:///D:/html5%20puzzle/jquery.js:2

La fonction pertinente est la suivante :

function showWithAnimation(){                  
  console.log('animation called');
  $('#popup').show();
  $("#popup").css({"top": "30%", "left": "30%"})
             .animate({top:(($(window).height()/2)-($('#popup')
             .outerHeight()/2))-70}, 1000, 'easeOutBounce')
             .show();
}

La fonction est responsable de l'affichage du div avec une animation de rebond, cependant, le div est affiché mais sans effet de rebond.

EDITAR:

J'inclus les bibliothèques jQuery et jQueryUI depuis un CDN comme ceci (dans l'ordre) :

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js'>
</script>

Answer 1

Si vous utilisez Bootstrap, il est également possible que le jQuery de Bootstrap, s'il est inclus sous votre balise jQuery script, écrase votre balise jQuery script avec une autre version. Inclure le propre CDN de jQuery et supprimer la balise jQuery script que Bootstrap fournit était la seule chose qui fonctionnait pour moi.

Answer 2

Importation de jquery.easing cdn a fonctionné pour moi.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>

Vous pouvez ajouter ce bas de la page web.

Answer 3

Pour tous ceux qui rencontrent cette erreur et qui ont essayé de mettre à jour les versions et de s'assurer que le noyau d'effets est présent, etc. et qui se grattent toujours la tête. Vérifiez la documentation pour animate() et les autres syntaxes.

J'ai simplement écrit "Linear" au lieu de "linear" et j'ai obtenu le message [this.easing] n'est pas une fonction.

$("#main").animate({ scrollLeft : '187px'}, 'slow', 'Linear') ; //mauvais

$("#main").animate({ scrollLeft : '187px'}, 'slow', 'linear') ; //bien

Answer 4

J'ai découvert une chose très étrange, mais importante à savoir : Lorsque vous avez installé jQuery ui (1.12.1), beaucoup de facilités fonctionnent, par exemple :

jQuery('#my-elm').animate({marginLeft:500},1000,'linear');
jQuery('#my-elm').animate({marginLeft:500},1000,'easeOutBounce');

fonctionne, mais le défaut :

jQuery('#my-elm').animate({marginLeft:500},1000,'swipe');

génère de très nombreuses erreurs

Answer 5

J'ai trouvé le problème : n'utilisez pas de CDN (c'est ce qui cause le problème !), enregistrez plutôt le fichier jquery localement sur votre serveur et le problème disparaît.