Coding effect happening once only

Hey.
So My problem is the roll effect is only happening once.
The code here works no problem. When I mouse over a second time, the roll effect is not happening.

thx

let rolleffectoptions = {
    "direction": "top"
}
export function box10_mouseIn(event) {
    $w('#box11').expand().then(()=>
        {$w('#box11').show("roll",rolleffectoptions)})
}

export function box10_mouseOut(event) {
    $w('#box11').collapse()
}

For the show function to work, the element needs to be hidden. Changing the mouse_out event to this should fix the problem.

export function box10_mouseOut ( event ){
$w ( ‘#box11’ ). collapse ()
$w ( ‘#box11’ ). hide ()
}