I am trying to make a div id visible only during a resizing event using javascript. I have code written that triggers when I resize the window - but I wish for this to stop triggering and revert back to hidden for the div style after the resize event.

window.addEventListener('resize', animateWindow);

function animateWindow(){
    var x = document.getElementById("resize-text");
    x.style.visibility = "visible";
}

The CSS code is set to this:

#resize-text{
    visibility: hidden;
    width: 100%;
    height: 100%;
    background-color: blueviolet;
}

Should I do an if else statement using an event listener? Or what is the best approach for this?

Many thanks!