Greetings All.

You may have seen this effect on some other sites and wonder if it was even possible with Elementor.

Well the answer is yes and very easy I might add. With no additional javascript needed just some crafted CSS.

Keep in mind for this particular method to work you will need Elementor Pro.

Let’s Begin

First we need to drag a single video widget onto the page in a single column section.

Next we need to go inside that section and apply this CSS and select the option to make the section sticky top in the motion effects.

I chose to have this sticky only on desktop.

@keyframes fade-in-up {
	 0% {
		 opacity: 0;
	}
	 100% {
		 transform: translateY(0);
		 opacity: 1;
	}
}

selector.elementor-sticky--effects {
    right: 25px!important;
    top: 70vh!important;
    width: 500px!important;
    transform: translateY(100%);
    animation: fade-in-up 0.75s ease forwards;
}
selector {
     transition: all 0.5s ease;
     
}

The above css adds some animation and position to the video once it is in its sticky state.

Here is the result:

Hope you found this useful 😀.