JQuery транзит при наведении

Question

Довольно новый в jQuery, с трудом решающий, как заставить транзит jQuery работать на hover.

$(".rotate").hover(function(){
    $(this).transition({
      perspective: '100px',
      rotateY: '180deg'
    });
});

Это возвращает "Uncaught TypeError: Свойство '$' объекта [объект Object] не является функцией", я некоторое время возился с этим, но, кажется, собираюсь по кругу.

Если кто-нибудь может указать мне правильное направление, я буду очень признателен.

Спасибо Фрэнк

Answer 1

Я получил это работает, в конечном итоге это была версия WordPress JQuery

см. здесь jQuery Uncaught TypeError: Свойство '$' объекта [Window объекта] не является функцией

Спасибо за вашу помощь!

Answer 2

CSS лучше во всех отношениях:

.rotate {
    transition: transform 0.4s ease;
    perspective: 100px;
}
.rotate:hover {
    transform: rotateY(180deg);
}

Просто говорю';)

Answer 3

Кажется, ваш код работает нормально, я просто быстро положил его на скрипку..... Вы определенно включили в себя и библиотеку jQuery, и библиотеку транзит.js?

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="http://ricostacruz.com/jquery.transit/jquery.transit.min.js"></script>
<style type="text/css">
  .rotate{ width:50px; height:50px; background-color:lightgrey; border:1px solid #000;  }
</style>
<div class='rotate'></div>    
<script type="text/javascript">
  $(".rotate").hover(function(){
    $(this).transition({
      perspective: '100px',
      rotateY: '180deg'
    });
  });
</script>