Jump to content
Search Community

samyH

Members
  • Posts

    4
  • Joined

  • Last visited

Posts posted by samyH

  1. Ah ok that's nice, but how would I remove the hover eventListeners on click?

     

    item.addEventListener("mouseenter", () => hover.play());
    item.addEventListener("mouseleave", () => hover.reverse());

    I thought the hover would have to be it's own function to be able to do that right?

  2. Hey,

     

    Hopefully a simple one for someone who's been using gsap more than a day :P

    I'm just trying to cut down on the number of gsap.to animations I'm calling, but I'm unable to get any animation happening when passing evt.currentTarget as it's always null - I also tried evt.target & event.target.id to no avail

     

    document.getElementById("menuitem0").addEventListener("mouseenter", hoverIn);
    
    function hoverIn(evt) {
    	console.log(evt);
    	gsap.to(evt.currentTarget, {
    		scale: 1.5,
    		color: "white",
    		duration: 0.3,
    		paused: true,
    		ease: "power2.inOut"
    	});
    }

     

    I saw you can do something like this 

    let hover1 = gsap.to(menuitem1, {
    			scale: 1.5,
    			color: "white",
    			duration: 0.3,
    			paused: true,
    			ease: "power2.inOut"
    		});
    
    		document.getElementById("menuitem1").addEventListener("mouseenter", () => hover1.play());
    		document.getElementById("menuitem1").addEventListener("mouseleave", () => hover1.reverse());

    but need to removeEventListener, so needed to break the function out

     

    Any help is much appreciated :D

×
×
  • Create New...