Hi,
I have the following which runs an animation for certain elements but it does it for all elements instead of just the one being hovered. Any way to change it so it only applies to the current element thats being hovered, rather than all of them at once ?
Thanks,
Scott.
// Animate Image Flipper
(function($) {
"use strict";
var tl = gsap.timeline();
tl.to(".top-image", {y: '-100%', duration: 0.4, ease: 'power3.inOut' });
var tl2 = gsap.timeline();
tl2.to(".bottom-image", {y: '-100%', duration: 0.4, ease: 'power3.inOut'});
tl.pause();
tl2.pause();
$(".image-flipper").mouseenter(function(){
tl.play();
tl2.play();
})
$(".image-flipper").mouseleave(function(){
tl.reverse();
tl2.reverse();
})
})(jQuery);