Mouse Follow Script, Cant Animer sur Hover

Question

J'essaie d'implémenter un script pour avoir un bloc div suivi de ma souris, puis l'animer lorsque je survole certains liens. Le problème est lors de la transformation en vol stationnaire de tous les objets, il commence à clignoter et devient fastidieux.

Codepen: https://codepen.io/grayghostvisuals/pen/kepDb/

var $circle = $('.circle'); 
function moveCircle(e) { 
TweenLite.to($circle, 0.7, { 
css: { 
    left: e.pageX, 
    top: e.pageY 
} 
    }); 
} 

$(window).on('mousemove', moveCircle); 

Toutes les idées?

Answer 1

Il semble s'agir d'un problème lié à l'index z. Hover va essayer de vérifier si votre souris est au-dessus de votre élément, mais il survolera le cercle en suivant votre souris. Ce stylo montre comment cela fonctionne si vous utilisez un z-index négatif pour le cercle, aussi.

Vous pouvez toutefois faire en sorte que votre navigateur ignore les événements de pointeur pour le cercle, en supprimant le problème tous ensemble. I changed your pen to add the solution.

.element { 
    pointer-events: none; 
}