Looped animations

Design help General
1

Hey guys,

I am looking for a way to upload animated looped videos on my website. It should work like here: https://pitch.com/

Could somebody tell me how this hero video is working?
It is a looped mp4 video that conforms to the dimensions of the div. How is it done? can I achieve the same with Webflow? by the way their video play also on mobile.

2

Anyone, guys? I would appreciate your feedback!

3

Try this on mobile (One line of custom code)

Anyway - your problem is with the “loop” or styles? Please be more specific.

Your reference. HTML5 video - autoplay + mute + playsinline - styles ( max-width: 1200px; width: 100%; height: auto;)

<video autoplay="" class="hero-video" height="763" loop="" muted="" playsinline="" src="https://d33wubrfki0l68.cloudfront.net/8068a02fdadfdc02d2355743a561c63d14668af2/7ed0e/videos/hero.mp4" width="1200"></video>
4

My problem is with the styles. The video doesn’t conform to the dimensions of the div.

5

Add this custom code - publish and test the live URL

<style>
   .w-background-video > video {
       width: 100%;
   }
</style>

Also its better to add your site URL (To get specific answer) + Please change the Q title to something more specific