Smooth out Effect Options on Hover, MouseOut is sticky

Ask the community
,
1

Hey y’all. Trying to add an effect to the hovers on my repeater on this page . I got the right effect going on, but I’m having an issue where if you move the mouse out too quickly, the hover stays stuck.

Can anyone help me clean up my code so this doesn’t happen?

Here’s my code.

$w.onReady(function () {
    $w("#container1").onMouseIn((event) => {
 let $item = $w.at(event.context);
 let slideOptions = {
 "duration":   200,
 "delay":      0,
 "direction":  "bottom",
        };
        $item("#box1").show("slide", slideOptions);
        });
    $w("#container1").onMouseOut((event) => {
 let $item = $w.at(event.context);
 let slideOptions = {
 "duration":   200,
 "delay":      0,
 "direction":  "bottom",
        };
        $item("#box1").hide("slide", slideOptions);
    });
})

I’m super new at this so I’ve just been trying to piece things together.

Thanks so much for your help!

J

2

Hoping to bump this in case anyone has any solutions they can share!