Как использовать mixitup и jquery вместе?

Question

[DanilChekh]

Подскажите, на странице возникает ошибка Uncaught TypeError: $(...) is not a function , это если на вордпресс хостинге,на локальном все работает правильно,погуглил пишут что конфликт бибилиотек, как это исправить?Код js

<script type="text/javascript">
  $(function () {
 
    var filterList = {
 
      init: function () {
        $('#portfoliolist').mixitup({
          targetSelector: '.portfolio',
          filterSelector: '.filter',
          effects: ['fade'],
          easing: 'snap',
          // call the hover effect
          onMixEnd: filterList.hoverEffect()
        })    
 
      },
 
      hoverEffect: function () {
 
        $('#portfoliolist .portfolio').hover(
          function () {
            $(this).find('.label').stop().animate({bottom: 0}, 200, 'easeOutQuad');
            $(this).find('img').stop().animate({top: -30}, 500, 'easeOutQuad');       
          },
          function () {
            $(this).find('.label').stop().animate({bottom: -40}, 200, 'easeInQuad');
            $(this).find('img').stop().animate({top: 0}, 300, 'easeOutQuad');               
          }   
        );        
 
      }
 
    };
    filterList.init();  
  }); 
</script>

Просто в верстке все работает правильно,а вот на сайте уже нет,

Comments

[DanilChekh]

Вот полный лог ошибки
Uncaught TypeError: $(...).mixitup is not a function
at Object.init ((index):179)
at HTMLDocument. ((index):206)
at c (jquery.min.js:3)
at Object.fireWith [as resolveWith] (jquery.min.js:3)
at Function.ready (jquery.min.js:3)
at HTMLDocument.H (jquery.min.js:3)

[Орхан Гасанлы]

А попробуйте $ заменить на jQuery.
Обычно на ВП проблема возникает из-за конфликта.

[Орхан Гасанлы]

и подключите скрипт также через functions.php

[DanilChekh]

azerphoenix, я пробывал отдельный файл создать my.js и туда его написать, и через functions.php подключать,не помогло доллары в скрипты поменял на jquery тоже нет результата, но на просто сверстанной странице все работает,может как то напрямую его подключить можно?

[DanilChekh]

azerphoenix, спасибо за помощь,оказывается вп автоматически подключает jquery, и я его только переопределял и ошибку давало

[Орхан Гасанлы]

DanilChekh, по умолчанию в ВП есть jquery. Если вам нужно было его переопределить, то для начала нужно сделать deregister

Answer 1

[Денис Янчевский]

Попробуйте так:

(function ($) {
    $(document).ready(function () {
		var filterList = {
		 
			  init: function () {
				$('#portfoliolist').mixitup({
				  targetSelector: '.portfolio',
				  filterSelector: '.filter',
				  effects: ['fade'],
				  easing: 'snap',
				  // call the hover effect
				  onMixEnd: filterList.hoverEffect()
				})    
		 
			  },
		 
			  hoverEffect: function () {
		 
				$('#portfoliolist .portfolio').hover(
				  function () {
					$(this).find('.label').stop().animate({bottom: 0}, 200, 'easeOutQuad');
					$(this).find('img').stop().animate({top: -30}, 500, 'easeOutQuad');       
				  },
				  function () {
					$(this).find('.label').stop().animate({bottom: -40}, 200, 'easeInQuad');
					$(this).find('img').stop().animate({top: 0}, 300, 'easeOutQuad');               
				  }   
				);        
		 
			  }
		 
		};
		filterList.init();  
    });
})(jQuery);