Load video ON MOUSE HOVER!

Hello guys!
I have a CMS portfolio site with lots of videos.
I want the videos to be LOADED ONLY when somebody hovers on the thumbnail (image).
I really searched everywhere here in the forum, but can’t found a real solution.

What i really need is to enable the video link when mouse hover and disable when hover out.

I have built CMS linked collection list and load the videos with custom code:

The problem is that it loads all the videos when i open the page, and i have 60 of them :slight_smile:

Is there a little code what i can include to load only when hover?

So i can set background images for thumbnails and the loaded video will be on top of the image.


Here is my public share link: LINK
(how to access public share link)

What i am thinking is to set a picture thumbnail for a div background. I can pull this from CMS, so i have video thumbnails for all the videos loaded fast.

And when i hover on the thumbnails, its loads the video from an embedded link. from the CMS.

I can do everything , except the “on hover” load embedded code.

Thank you