Add slide Animation to any Elementor Widget without any plugin.

Slide Text Widget

---------------------- JS Script -----------------------------

JS Script (Place in content as HTML Widget)

var content = document.getElementById("showpopup01"); // listener to Column or Element

content.addEventListener('mouseover', mouseOver);
content.addEventListener('mouseout', mouseOut);

function mouseOver() {
    document.getElementById("text01").classList.add("vtext_visible");  // "text01" listener to Text Element and add class "vtext_visible"
}

function mouseOut() {
    document.getElementById("text01").classList.remove("vtext_visible"); // "text01" listener to Text Element and remove class "vtext_visible"
}

------------------ CSS ---------------------
Place CSS on Page, theme, or anywhere. (only one Time on full Page)

.vtext {
    opacity:0;
    visibility: hidden;
    z-index:-9999;
}

.vtext_visible {
    opacity:1;
    visibility: visible;
    z-index:10;
    animation: 1s slide-right 0s forwards;
    transform:translateX(-100%);
}
@keyframes slide-right {
  to {
    transform:translateX(0);
  }
}


------------------ Widget Elementor -----------------
Column, Section — according to needs: 
Add CSS - ID "showpopup01" to the upper Column where you wish to hear

Element to show — for example Text Element:
place inside the Column, Section a "Text Widget" and add class "vtext" and add the CSS ID "text01"