Forum Discussion
Gsap Mouse Down animation
Hello everyone,
I am currently working on a little game where the character used must walk, so I've been trying to use GSAP to make it work, the interaction is simple:
While the button is pressed...
Try this:
let object1 = document.querySelector("[data-model-id='6ZrZMfnavnW']");
let button = document.querySelector("[data-model-id='6fhUtThupA']");
// function called each tick while pressed
function moveStep() {
gsap.set(object1, { x: "-=2" }); // move 2px per frame (adjust as desired)
}
button.addEventListener("mousedown", () => {
gsap.ticker.add(moveStep);
});
button.addEventListener("mouseup", () => {
gsap.ticker.remove(moveStep);
});
button.addEventListener("mouseleave", () => {
gsap.ticker.remove(moveStep);
});